Html, php, bulle avec la souris
Résolu/Fermé
Wolfylink
Messages postés
192
Date d'inscription
jeudi 11 juin 2009
Statut
Membre
Dernière intervention
14 novembre 2010
-
28 juin 2009 à 13:54
romaissa - 23 janv. 2014 à 10:15
romaissa - 23 janv. 2014 à 10:15
A voir également:
- Html, php, bulle avec la souris
- Quelle touche pour débloquer la souris ? - Guide
- Editeur html - Télécharger - HTML
- Easy php - Télécharger - Divers Web & Internet
- Autoclick souris - Télécharger - Divers Utilitaires
- Html download - Télécharger - HTML
13 réponses
juanou
Messages postés
137
Date d'inscription
vendredi 28 novembre 2008
Statut
Membre
Dernière intervention
23 août 2013
58
3 févr. 2010 à 09:33
3 févr. 2010 à 09:33
Salut,
Est-ce que je peux me permettre d'ajouter ma petite solution personnelle ?
C'est du javascript aussi (+ design css), mais avec quelques bonus :
- quand elle au bord de la fenêtre, la bulle se positionne "intelligemment", de façon à ne pas déborder.
- par défaut, la bulle se positionne au dessus plutôt qu'en dessous de l'élément déclencheur. Ça fait plus propre.
- elle apparaît avec un effet de fondu (pas obligatoire toutefois)
- c'est conçu pour fonctionner en javascript non intrusif, ce qui permet de garder un code HTML aussi clair que possible
infobulles : https://reactdom.com/restful-api/
Sur ce même site, je présente une variante un peu plus complète et complexe, qui permet aussi de charger le contenu de la bulle par ajax, de lui donner un titre, ou encore de créer des infobulles persistantes (permet notamment d'aller cliquer sur des liens dans la bulle) :
infobulles complexes et boîtes de dialogue : https://reactdom.com/restful-api/
J'ai passé un peu de temps là-dessus, alors si ça peut servir à d'autres ça me fera plaisir.
(cela dit, j'aime bien aussi la solution css pure que tu proposes, IgnisFatuus)
Est-ce que je peux me permettre d'ajouter ma petite solution personnelle ?
C'est du javascript aussi (+ design css), mais avec quelques bonus :
- quand elle au bord de la fenêtre, la bulle se positionne "intelligemment", de façon à ne pas déborder.
- par défaut, la bulle se positionne au dessus plutôt qu'en dessous de l'élément déclencheur. Ça fait plus propre.
- elle apparaît avec un effet de fondu (pas obligatoire toutefois)
- c'est conçu pour fonctionner en javascript non intrusif, ce qui permet de garder un code HTML aussi clair que possible
infobulles : https://reactdom.com/restful-api/
Sur ce même site, je présente une variante un peu plus complète et complexe, qui permet aussi de charger le contenu de la bulle par ajax, de lui donner un titre, ou encore de créer des infobulles persistantes (permet notamment d'aller cliquer sur des liens dans la bulle) :
infobulles complexes et boîtes de dialogue : https://reactdom.com/restful-api/
J'ai passé un peu de temps là-dessus, alors si ça peut servir à d'autres ça me fera plaisir.
(cela dit, j'aime bien aussi la solution css pure que tu proposes, IgnisFatuus)
Utilisateur anonyme
28 juin 2009 à 14:16
28 juin 2009 à 14:16
Bonjour,
En html si tu veux dire "cette image est un lien", le code va ressembler à ça :
<img src="le nom du document où se trouve l'image/le nom de l'image.format" alt="cette image est un lien"/>
Voilà, j'espère avoir pu t'éclairer ^^
En html si tu veux dire "cette image est un lien", le code va ressembler à ça :
<img src="le nom du document où se trouve l'image/le nom de l'image.format" alt="cette image est un lien"/>
Voilà, j'espère avoir pu t'éclairer ^^
moderno31
Messages postés
870
Date d'inscription
mardi 23 juin 2009
Statut
Membre
Dernière intervention
8 août 2012
92
28 juin 2009 à 16:57
28 juin 2009 à 16:57
Hello,
Il ne s'agit pas d'un infobulle meme si ça y ressemble.
C'est une sort de boite flottante qui est désactivée (cachée par défaut) et sur l'évènement "passe ta souris sur une image nommé x" elle s'affiche. Cette même boite flottante peut etre utilisée comme zone de texte pour positionner des infos à des endroits innaccessible sur une page.
Donc je suis l'idée du code CSS... A tester pour voir ce que ça fait
Bien vu IgnisFatuus
A+
Il ne s'agit pas d'un infobulle meme si ça y ressemble.
C'est une sort de boite flottante qui est désactivée (cachée par défaut) et sur l'évènement "passe ta souris sur une image nommé x" elle s'affiche. Cette même boite flottante peut etre utilisée comme zone de texte pour positionner des infos à des endroits innaccessible sur une page.
Donc je suis l'idée du code CSS... A tester pour voir ce que ça fait
Bien vu IgnisFatuus
A+
Utilisateur anonyme
28 juin 2009 à 17:51
28 juin 2009 à 17:51
Voici un lien qui devrait t'aider http://peutetreunereponse.over-blog.com/article-6614978.html
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Wolfylink
Messages postés
192
Date d'inscription
jeudi 11 juin 2009
Statut
Membre
Dernière intervention
14 novembre 2010
25
28 juin 2009 à 14:32
28 juin 2009 à 14:32
Merci, InginsFatuus...
Cependant, je ne parlais pas de l'option alt (que je connaissais déjà par ailleurs) mais d'un info-bulle...
Un peu comme celle-ci :
http://damienalexandre.fr/share/info-bulle-javascript.html
Si quelqu'un veut bien me répondre, merci !
Cependant, je ne parlais pas de l'option alt (que je connaissais déjà par ailleurs) mais d'un info-bulle...
Un peu comme celle-ci :
http://damienalexandre.fr/share/info-bulle-javascript.html
Si quelqu'un veut bien me répondre, merci !
Wolfylink
Messages postés
192
Date d'inscription
jeudi 11 juin 2009
Statut
Membre
Dernière intervention
14 novembre 2010
25
28 juin 2009 à 20:51
28 juin 2009 à 20:51
Bon...
Merci pour tous vos conseils, mais c'est bon, j'ai compris comment ça marche... J'ai fait une sorte d'info-bulle personnalisée...
J'ai utilisé du javascript... Alors, pour ceux qui lisent ce sujet et qui ne savent pas comment faire :
http://damienalexandre.fr/Info-Bulle-en-Javascript.html
Voilà !
Merci à tous !!!
Merci pour tous vos conseils, mais c'est bon, j'ai compris comment ça marche... J'ai fait une sorte d'info-bulle personnalisée...
J'ai utilisé du javascript... Alors, pour ceux qui lisent ce sujet et qui ne savent pas comment faire :
http://damienalexandre.fr/Info-Bulle-en-Javascript.html
Voilà !
Merci à tous !!!
voila le code a mettre pour avoir les infos bulles
<ima id="truc" src="accueil-icone-6603-48j.png" title="Non" alt="bidule" />
je l'ai utilisé et ça a marcher
<ima id="truc" src="accueil-icone-6603-48j.png" title="Non" alt="bidule" />
je l'ai utilisé et ça a marcher
Utilisateur anonyme
28 juin 2009 à 15:33
28 juin 2009 à 15:33
J'ai trouvé ceci :
}
.infobulle{
position: absolute;
visibility : hidden;
border: 1px solid Black;
padding: 10px;
font-family: Verdana, Arial;
font-size: 10px;
background-color: #FFFFCC;
}
}
.infobulle{
position: absolute;
visibility : hidden;
border: 1px solid Black;
padding: 10px;
font-family: Verdana, Arial;
font-size: 10px;
background-color: #FFFFCC;
}
moderno31
Messages postés
870
Date d'inscription
mardi 23 juin 2009
Statut
Membre
Dernière intervention
8 août 2012
92
28 juin 2009 à 17:21
28 juin 2009 à 17:21
Avec plaisir très chère ou Très cher lol
Utilisateur anonyme
28 juin 2009 à 17:24
28 juin 2009 à 17:24
Très chère :)
En espérant que ça puisse aider Wolfylink.
Pour ma part, j'ai testé et ça marche donc il ne devrait pas y avoir de soucis.
En espérant que ça puisse aider Wolfylink.
Pour ma part, j'ai testé et ça marche donc il ne devrait pas y avoir de soucis.
moderno31
Messages postés
870
Date d'inscription
mardi 23 juin 2009
Statut
Membre
Dernière intervention
8 août 2012
92
28 juin 2009 à 17:26
28 juin 2009 à 17:26
Ok, :)
Bonne chance dans tes travaux alors. Moi j'en ai encore "montagne" à faire avec les miens
Bonne chance dans tes travaux alors. Moi j'en ai encore "montagne" à faire avec les miens
Wolfylink
Messages postés
192
Date d'inscription
jeudi 11 juin 2009
Statut
Membre
Dernière intervention
14 novembre 2010
25
28 juin 2009 à 17:31
28 juin 2009 à 17:31
Merci... Mais mettre cette portion de code sur mon fichier css suffit ?
Ou faut-il mettre un code en HTML disant "quand la souris passe sur x, mettre y chose avec les propriétés css entrées précédement ?
Désolé pour toutes ces questions... En revanche, si quelqu'un a besoin d'aide, je suis à vous ! Je m'y connais très bien en HTML, PHP, MySQL et assez bien en css...
Donc, voilà !
@ + !
Ou faut-il mettre un code en HTML disant "quand la souris passe sur x, mettre y chose avec les propriétés css entrées précédement ?
Désolé pour toutes ces questions... En revanche, si quelqu'un a besoin d'aide, je suis à vous ! Je m'y connais très bien en HTML, PHP, MySQL et assez bien en css...
Donc, voilà !
@ + !
