| | Faire une infobulle (messages) |  |
|
|
 Hosted 
{ Membre }
 Messages : 23
 | Alors avant d'exposer mon problème je tiens à dire quand même que c'est un très beau tuto et très pratique ^^
Alors mon problème c'est que quand je clique sur le lien dans l'infobulle, sa m'amène sur le premier lien ( celui ou quand on passe la souris dessus l'infobulle apparait )
Pour mieux t'expliquer je vais prendre un exemple
J'ai mon premier lien " Hosted " ( qui amène à mon profil ) quand on survole ce pseudo avec la souris l'infobulle s'affiche donc, dans celle ci j'ai un autre lien " Envoyez un Mp à Hosted " et quand je clic sur celui la bah en faite sa me met le profil Hosted.
Voila j'espère que c'est claire une nouvelle fois xD | | |
|
| | |
Lilypad
{ Membre }
 Messages : 108
| Tu peux me donner le lien de ton forum, ton code CSS et ton code HTML pour que je vois où est le problème s'il te plait ? ^^ | | |
|
| | |
Hosted
{ Membre }
Messages : 23
| Oui oui alors voila le lien du forum je m'en sert de test xD Cliiic Et voici mon code HTML ainsi que le CSS je tes mis qu'une partie. - Code:
-
<a href="http://diamond-shinobi.forumactif.org/profile.forum?mode=viewprofile&u=1" class="infobulle"><b>Z</b>etsu ~ <span><img src="http://i82.servimg.com/u/f82/11/12/16/65/zetsu10.jpg"><br><p>Fondateur ~</p><div><a href="http://diamond-shinobi.forumactif.org/msg.forum?mode=post&u=1">Envoyez un Mp ~</a></div></span></a> - Code:
-
a.infobulle {
position: relative;
}
a.infobulle span {
display: none; /* ceci masque l'infobulle */
}
a.infobulle:hover {
background: none; /* correction d'un bug IE */
z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
}
a.infobulle:hover span {
display: inline; /* ceci affiche l'infobulle */
position: absolute;
white-space: nowrap; /* on change la valeur de la propriété white-space pour qu'il n'y ait pas de retour à la ligne non-désiré */
top: 5px; /* on positionne notre infobulle */
left: 30px;
background: #ebebeb; /* arrière-plan de l'infobulle */
color: black; /* texte dans l'infobulle */
padding: 3px;
/* bordures de votre infobulle*/
border: 1px dotted black;
border-left: 1px dotted black;
}
| | |
|
| | |
Lilypad
{ Membre }
Messages : 108
| Si tu remplaces :
- Code:
-
<a href="http://diamond-shinobi.forumactif.org/profile.forum?mode=viewprofile&u=1" class="infobulle"><b>Z</b>etsu ~ <span><img src="http://i82.servimg.com/u/f82/11/12/16/65/zetsu10.jpg"><br><p>Fondateur ~</p><div><a href="http://diamond-shinobi.forumactif.org/msg.forum?mode=post&u=1">Envoyez un Mp ~</a></div></span></a>
Par :
- Code:
-
<a href="http://diamond-shinobi.forumactif.org/profile.forum?mode=viewprofile&u=1" class="infobulle"><b>Z</b>etsu ~ <span><img src="http://i82.servimg.com/u/f82/11/12/16/65/zetsu10.jpg"><br><p>Fondateur ~</p><div><a href="http://diamond-shinobi.forumactif.org/msg.forum?mode=post&u=1" target="_blank">Envoyez un Mp ~</a></div></span></a>
Ca devrait fonctionner. *continue de chercher une autre solution*
Edit : Bon je vois pas trop comment faire autrement.. :/ Bref donc j'ai rajouté la balise target blank dans ton lien, dans l'infobulle.
Par contre ça ouvre bien dans un autre onglet la page du MP, mais ça ouvre aussi le profil (donc le premier lien) sur la première page.
Edit 2 : Une autre solution, qui semble meilleure serait de ne pas mettre de lien vers le profil sous le nom, mais de le mettre dans l'infobulle aussi.
Comme ceci :
- Code:
-
<a href="#" class="infobulle"><b>Z</b>etsu ~ <span><img src="http://i82.servimg.com/u/f82/11/12/16/65/zetsu10.jpg"><br><p>Fondateur ~</p><div><a href="http://diamond-shinobi.forumactif.org/profile.forum?mode=viewprofile&u=1" target="_blank">Voir le profil ~</a><br><a href="http://diamond-shinobi.forumactif.org/msg.forum?mode=post&u=1" target="_blank">Envoyez un Mp ~</a></div></span></a> | | |
|
| | |
Hosted
{ Membre }
Messages : 23
| Oui la deuxième solution me semble mieux ^^ je vais faire comme sa Mercii pour ton aide  | | |
|
| | |
Lilypad
{ Membre }
Messages : 108
| Après quelques recherches il semblerait que mettre un lien dans un lien ne soit pas top top.. Or là c'est le cas dans mon exemple.
En fait ça marche si c'est le même lien quoi... mais en gros si on met un lien sur le premier truc (texte ou image), comme la balise est fermée à la fin de l'infobulle, c'est le lien qui est sous toute l'infobulle. Je sais pas si c'est très clair, donc quelque que soit l'endroit où on clique sur l'infobulle, le lien ne change pas, et reste le même.
Je vais éditer mon tuto. | | |
|
| | |
Hosted
{ Membre }
Messages : 23
| Ah oui, j'avais remarquer sa aussi lors de mes précédentes infobulles xD
Donc la meilleur solution c'est bien comme ta dit dans ton edit 2 c'est parfait comme sa ^^ | | |
|
| | |
Invité Invité
| Je me permet de met une petite capture d'écran pour donner un aperçu du résultat de ton tuto :  Bon ça n'a pas été réalisé grâce au même code, mais le résultat est le même ! | | |
|
| | |
Invité Invité
| J'ai le code pour une infobulle typique, ok. J'ai complèter avec tes codes pour y ajouter des liens. Seulement, soucis. Ca semble fonctionné mais je ne sais pas aller avec ma souris sur mon infobulle, du coup, dur dur de pouvoir cliquer sur les liens figurant à l'intérieur. Y a t-il une solution ? Voici mon code : - Code:
-
<a class="imginfo"><img src="http://img3.xooimage.com/files/7/4/e/jhyun-1415d24.png"><span><table width="125" border="0" cellpadding="1" cellspacing="1"><tbody><tr><td style="text-align: center;"><font size="1"><strong>Mayuko</strong><br> feat. Kim Jae Hyun</font><br></td></tr><tr><td style="text-align: center;"><a class="imginfo"><img src="http://img1.xooimage.com/files/2/a/7/jhyun1-1415d2c.png"></a></td></tr><tr><td style="text-align: center;"><font size="1">Administratrice<br> Tyrannique<br> <div><a href="http://suitasuru.forumactif.com/profile.forum?mode=viewprofile&u=2" target="_blank">Voir le profil</a></div><div><a href="http://suitasuru.forumactif.com/msg.forum?mode=post&u=2" target="_blank">Envoyez un MP</a></div></font></td></tr><tr align="center"></tr></tbody></table> </span></a> | | |
|
| | |
Darling
{ Membre }
Messages : 180
| Salut Maro,
Petite parenthèse. Un lien vers l'affichage de ton problème ainsi que ton CSS Aiderait.
@+ | | |
|
| | |
Lilypad
{ Membre }
Messages : 108
| Coucou 
Je pense que ça vient de cette partie du code
- Code:
-
top: 5px; /* on positionne notre infobulle */
left: 30px;
Sur ton forum tu as mis :
- Code:
-
top: 30px; /* on positionne notre infobulle */
left: 20px;
Ce qui fait que l'infobulle est trop décalée par rapport à l'image à partir de laquelle tu la crées. Et donc l'infobulle disparait quand tu veux passer la souris dessus, puisque tu passes sur du vide entre les deux. | | |
|
| | |
Invité Invité
| Oups désolée ^^'
Merci Lilypad, problèmes résolu =) | | |
|
| | |
Invité Invité
| Coucou =)
Je voudrais savoir si ya une limite de texte dans une infobulle ? (genre 3 ligne, 150 caractère ...)
Merci ^^ | | |
|
| | |
Lilypad
{ Membre }
Messages : 108
| Pas à ma connaissance, mais je pense qu'il vaut mieux rester dans tes petits textes, comme son nom l'indique l'infobulle est là pour ajouter une information, pas pour mettre tout un texte genre contexte de forum RPG. | | |
|
| | |
Invité Invité
| moué :s cetait pas pour faire le contexte.
Je voyais plus grand :s ya pas un truc du même genre ou on pourrait mettre plus d'info =)
De toute facon, je vais essayer ce week end et puis je te dirais ^^
Merci Lily =) | | |
|
| | |
Lilypad
{ Membre }
Messages : 108
| Non mais tu peux le faire hein, y'a pas de limite ^^ | | |
|
| | |
Invité Invité
| ok, au moins je vais pas essayer puis qu'après il me dise "non ca ne va pas chouchoute, recommence !"
lol T_T avec ma chance surtout !
Merci Lyli | | |
|
| | |
Invité Invité
| flute alors on peut éditer ?
Donc j'ai essayer Lily mais ca me fait une toute rikiki infobulle, ya moyen de la faire un peu plus grosse ? | | |
|
| | |
Lilypad
{ Membre }
Messages : 108
| Mhh tu peux me donner le lien du forum en question pour que je voie ? | | |
|
| | |
Invité Invité
| J'ai fait un screen de l'infobulle  et le code que jai mis c'est le même que toi | | |
|
| | |
Lilypad
{ Membre }
Messages : 108
| Tu peux me donner le lien du forum, s'il te plait ? | | |
|
| | |
Jessica A.
{ Membre }
Messages : 139
| Si je mets deux infobulles à la suite elles sont collées...alors j'enlève le et elles sont collées... | | |
|
| | |
Jessica A.
{ Membre }
Messages : 139
| En fait j'ai réussis, merci^^ | | |
|
| | |
Invité Invité
| - Lilypad a écrit:
Tu peux me donner le lien du forum, s'il te plait ? http://lover-love.1fr1.net/forum.htm désolé ^^ | | |
|
| | |
Lilypad
{ Membre }
Messages : 108
| Je vois pas où sont tes infobulles sur le forum. Tu peux me le dire ? | | |
|
| | |
Contenu sponsorisé
| |
| | |
| | Faire une infobulle (messages) | |
|
