Infobulle problème.

2 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Infobulle problème.

Message par Yuuko Nakami Sam 18 Juin 2011 - 11:46

Bonjours,
j'ai un problème d'infobulle. Je n'arrive pas du tout à les construire.
J'ai fait une PA en tableau mais quand j'ai essayer de faire mes infobulle, il y a eu un soucis.
Regardez :

Spoiler:

J'aimerais bien savoir comment je pourrais améliorer tout cela.

Voici mon CSS pour les infobulles :

Code:
.infobulle{position: relative;z-index: 0;}

.infobulle:hover{background-color: transparent;z-index: 50;}

.infobulle span{
position: absolute;
background-color: #000000;
padding: 5px;
left: -1000px;
visibility: hidden;
color: #FFFFFF;}

.infobulle span img{border: 1px;padding: 5px;}

.infobulle:hover span{
visibility: visible;
top: 2px;
left: 20px;
width: 150px ;
color:#FFF;
border: 1px solid #fff;
-moz-border-radius: 12px;
-webkit-border-radius: 12px;
border-radius: 12px;}

Et mon Html de ma PA :

Code:
<img src="http://img263.imageshack.us/img263/9503/hgx.png" alt="Ce qu’on voit quand on passe la souris sur l’image">
<table> 
<tr><td><img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzMDgzMzcyNzE*MjcmcHQ9MTMwODMzNzI3NjM4MCZwPTE4MDMxJmQ9Jmc9MSZvPWQ*OWQ2Y2I3ODFhNzQ2ZjU5N2Jh/OGIwYzQzZDlmNTQ*.gif" /><embed src="http://assets.mixpod.com/swf/mp3/mff-mpodmin.swf?myid=82822863&path=2011/06/16" quality="high" wmode="transparent" flashvars="mycolor=19303B&mycolor2=558F46&mycolor3=132B36&autoplay=false&rand=0&f=4&vol=100&pat=0&grad=false" width="158" height="208" name="myflashfetish" salign="TL" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" border="0" style="visibility:visible;width:158px;height:208px;" /><br><a href="http://www.mixpod.com/playlist/82822863" target="_blank">

<td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 324px" ><center><b>CONTEXTE</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 160px; width: 338px" ><div style="width: 338px;height:160px;overflow:auto;">A l'intérieur de Tokyo, la capitale économique mondiale, vit une effroyable sensation de lourdeur. Une lourdeur permanente. Les japonais sont accablés par le travail qui est plus que nécessaire à leur survie et à celle de leur familles. Les gens sont devenus vraiment très agressif. Vous allez me dire : Mais vous êtes sûr que vous êtes au Japon, d'habitude c'est tout à fait l'inverse.Mais bon... Passons...<br><br>

Ils sont tous tellement fatigués qu'arrivés chez eux ils se couche immédiatement sans rien faire d'autre. Ils dorment... Ils dorment tous et font tous le même rêve : NE PLUS AVOIR BESOIN DE TRAVAILLER POUR POUVOIR VIVRE NORMALEMENT !<br><br>

Ce rêve, il n'y a rien que les hommes qui le font, les femmes elles, elles ne travailles pas, elles sont toutes femme au foyer. C'est bizarre comme vie, non ?<br><br>

Je vais vous raconter un peu l'ambiance de ce rêve : Tout d'abord, imaginez vous dans un village ou tous les habitants son des hommes. Ensuite, rentrons dans le détail de ce village. C'est une petite ville très charmante et très romantique avec des maisons très chaleureuse et un parc, puis plein d'autre chose. Quand vous y êtes, c'est comme si vous n'en sortait plus. Le matin, vous allez travailler et le soir vous rêver...<br><br>

C'est très simple, vous êtes rois à l'intérieur de ce petit village tout kawaii ! Vous êtes servis par un personnel très attentif. Mais faîtes attention ! Ce personnel est quelque peu trop... Abusif et c'est le cas de le dire. Il peuvent faire de vous se qu'ils veulent... Et même... Vous enfermer pour vous violer ! o(>///<)o</div>
</div></td>

<td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 240px" ><center><b>LIENS UTILES</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 160px; width: 338px" >TON TEXTE</div></td>
</tr></table>

<table><tr><td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 226px" ><center><b>STAFF</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 100px; width: 240px" ><div class="infobulle"><img src="http://img11.hostingpics.net/pics/945143MOI.png">
    <span><font color="#ffffff">~BLA BLA BLA~<br>
    ~ BLA BLA BLA ~<br></font>
    <br><img src="http://img11.hostingpics.net/pics/945143MOI.png"><br><br>Administateur & Fondateur<br><a href="http://yaoi-no-gyoukai.meilleurforum.net/u1" target="_blank">Profil</a> . <a href="http://yaoi-no-gyoukai.meilleurforum.net/u1contact" target="_blank">Mp</a></span></div><div class="infobulle"><img src="http://img11.hostingpics.net/pics/312402CHLOE.png">
    <span><font color="#ffffff">~BLA BLA BLA~<br>
    ~ BLA BLA BLA ~<br></font>
    <br><img src="http://img11.hostingpics.net/pics/870796FANNY.png"><br><br>Modérateur<br><a href="" target="_blank">Profil</a> . <a href="" target="_blank">Mp</a></span></div><div class="infobulle"><img src="http://img11.hostingpics.net/pics/870796FANNY.png">
    <span><font color="#ffffff">~BLA BLA BLA~<br>
    ~ BLA BLA BLA ~<br></font>
    <br><img src="http://img11.hostingpics.net/pics/870796FANNY.png"><br><br>Modérateur<br><a href="" target="_blank">Profil</a> . <a href="" target="_blank">Mp</a></span></div></tr>
</div><td></tr></table>


<td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 226px" ><center><b>TOP-SITE</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 100px; width: 240px" >TON TEXTE</div></td>

<td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 226px" ><center><b>PARTENAIRES</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 100px; width: 240px" >TON TEXTE</div></td>
</tr></table>


<table><tr><td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 356px" ><center><b>AVERTISSEMENT</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 60px; width: 370px" ><center>Attention !<br>
Ce forum est un forum yaoi #{relations Gay}#<br>
Tout mineur de moins de 15 ans et homophobes sont interdit ici !<br>
En tout cas, vous êtes prévenus. Nous ne prenons aucune responsabilité !</center></div></td>

<td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 356px" ><center><b>CREDIT</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 60px; width: 370px" ><center>Le disign du forum a été créé par IKARI Mitsuo<br>
Le graphisme aussi. <br>
Le copyright est interdit, il faut respecter le travail de l'administrateur !</center></div></td>
</tr></table>
 
  <img src="http://img839.imageshack.us/img839/9812/kfhtdyft.png" alt="Ce qu’on voit quand on passe la souris sur l’image">
Yuuko Nakami

Yuuko Nakami
**

Messages : 77
Inscrit(e) le : 20/05/2011

http://sweet-yuri.forumactif.com
Yuuko Nakami a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Infobulle problème.

Message par Anzu Sam 18 Juin 2011 - 14:21


Bonjour,

Je me suis permise de corriger l'ensemble de votre code, parce qu'il y avait pas mal d'erreurs. (donc je ne sais pas si le rendu est le bon mais c'est quand même mieux qu'avant Razz)

Code:
<img src="http://img263.imageshack.us/img263/9503/hgx.png" alt="Ce qu’on voit quand on passe la souris sur l’image">
<table>
<tr><td><img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzMDgzMzcyNzE*MjcmcHQ9MTMwODMzNzI3NjM4MCZwPTE4MDMxJmQ9Jmc9MSZvPWQ*OWQ2Y2I3ODFhNzQ2ZjU5N2Jh/OGIwYzQzZDlmNTQ*.gif" /><embed src="http://assets.mixpod.com/swf/mp3/mff-mpodmin.swf?myid=82822863&path=2011/06/16" quality="high" wmode="transparent" flashvars="mycolor=19303B&mycolor2=558F46&mycolor3=132B36&autoplay=false&rand=0&f=4&vol=100&pat=0&grad=false" width="158" height="208" name="myflashfetish" salign="TL" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" border="0" style="visibility:visible;width:158px;height:208px;" /><br><a href="http://www.mixpod.com/playlist/82822863" target="_blank">

<td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 324px" ><center><b>CONTEXTE</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 160px; width: 338px" ><div style="width: 338px;height:160px;overflow:auto;">A l'intérieur de Tokyo, la capitale économique mondiale, vit une effroyable sensation de lourdeur. Une lourdeur permanente. Les japonais sont accablés par le travail qui est plus que nécessaire à leur survie et à celle de leur familles. Les gens sont devenus vraiment très agressif. Vous allez me dire : Mais vous êtes sûr que vous êtes au Japon, d'habitude c'est tout à fait l'inverse.Mais bon... Passons...<br><br>

Ils sont tous tellement fatigués qu'arrivés chez eux ils se couche immédiatement sans rien faire d'autre. Ils dorment... Ils dorment tous et font tous le même rêve : NE PLUS AVOIR BESOIN DE TRAVAILLER POUR POUVOIR VIVRE NORMALEMENT !<br><br>

Ce rêve, il n'y a rien que les hommes qui le font, les femmes elles, elles ne travailles pas, elles sont toutes femme au foyer. C'est bizarre comme vie, non ?<br><br>

Je vais vous raconter un peu l'ambiance de ce rêve : Tout d'abord, imaginez vous dans un village ou tous les habitants son des hommes. Ensuite, rentrons dans le détail de ce village. C'est une petite ville très charmante et très romantique avec des maisons très chaleureuse et un parc, puis plein d'autre chose. Quand vous y êtes, c'est comme si vous n'en sortait plus. Le matin, vous allez travailler et le soir vous rêver...<br><br>

C'est très simple, vous êtes rois à l'intérieur de ce petit village tout kawaii ! Vous êtes servis par un personnel très attentif. Mais faîtes attention ! Ce personnel est quelque peu trop... Abusif et c'est le cas de le dire. Il peuvent faire de vous se qu'ils veulent... Et même... Vous enfermer pour vous violer ! o(>///<)o</div>
</div></td>

<td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 229px" ><center><b>LIENS UTILES</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 160px; width: 243px" >TON TEXTE</div></td>
</tr></table>

<table><tr>
<td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 226px" ><center><b>STAFF</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 100px; width: 240px" ><table width="100%"><tr><td>
<div class="infobulle"><img src="http://img11.hostingpics.net/pics/945143MOI.png">
    <span><font color="#ffffff">~BLA BLA BLA~<br>
    ~ BLA BLA BLA ~<br></font>
    <br><img src="http://img11.hostingpics.net/pics/945143MOI.png"><br><br>Administateur & Fondateur<br><a href="http://yaoi-no-gyoukai.meilleurforum.net/u1" target="_blank">Profil</a> . <a href="http://yaoi-no-gyoukai.meilleurforum.net/u1contact" target="_blank">Mp</a></span></div></td><td>
<div class="infobulle"><img src="http://img11.hostingpics.net/pics/312402CHLOE.png">
    <span><font color="#ffffff">~BLA BLA BLA~<br>
    ~ BLA BLA BLA ~<br></font>
    <br><img src="http://img11.hostingpics.net/pics/870796FANNY.png"><br><br>Modérateur<br><a href="" target="_blank">Profil</a> . <a href="" target="_blank">Mp</a></span></div></td><td>
<div class="infobulle"><img src="http://img11.hostingpics.net/pics/870796FANNY.png">
    <span><font color="#ffffff">~BLA BLA BLA~<br>
    ~ BLA BLA BLA ~<br></font>
    <br><img src="http://img11.hostingpics.net/pics/870796FANNY.png"><br><br>Modérateur<br><a href="" target="_blank">Profil</a> . <a href="" target="_blank">Mp</a></span></div>
</div></td></tr></table></td>

<td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 226px" ><center><b>TOP-SITE</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 100px; width: 240px" >TON TEXTE</div></td>

<td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 226px" ><center><b>PARTENAIRES</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 100px; width: 240px" >TON TEXTE</div></td>
</tr></table>


<table><tr><td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 356px" ><center><b>AVERTISSEMENT</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 60px; width: 370px" ><center>Attention !<br>
Ce forum est un forum yaoi #{relations Gay}#<br>
Tout mineur de moins de 15 ans et homophobes sont interdit ici !<br>
En tout cas, vous êtes prévenus. Nous ne prenons aucune responsabilité !</center></div></td>

<td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 356px" ><center><b>CREDIT</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 60px; width: 370px" ><center>Le disign du forum a été créé par IKARI Mitsuo<br>
Le graphisme aussi. <br>
Le copyright est interdit, il faut respecter le travail de l'administrateur !</center></div></td>
</tr></table>
 
  <img src="http://img839.imageshack.us/img839/9812/kfhtdyft.png" alt="Ce qu’on voit quand on passe la souris sur l’image">

Cordialement.
Anzu

Anzu
Membre actif

Féminin
Messages : 20685
Inscrit(e) le : 30/08/2007

https://forum.forumactif.com/
Anzu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Infobulle problème.

Message par Yuuko Nakami Sam 18 Juin 2011 - 14:55

Merci beaucoup sa a marcher.

Par contre, je ne sais pas si je peux poster sur ce sujet mais j'ai un autre problème. J'ai fais les partenaires mais j'ai beau changer le 'width' sa ne veux pas m'agrandir la largeur.

Spoiler:

Voici mon HTML pour les partenaires :

Code:
<td><div style="padding: 5px; border-right: 10px solid #363642; border-bottom: 3px solid #363642; border-left: 10px solid #363642; border-top: 3px solid #363642;  height: 15px; width: 226px" ><center><b>PARTENAIRES</b></center></div><div style="padding: 5px; border-right: 3px solid #363642; border-left: 3px solid #363642; border-bottom: 3px solid #363642;  height: 100px; width: 240px" ><marquee style="width: 150px;" direction="left
" onmouseover=this.stop(); onmouseout=this.start();
scrollamount="3">
<a href="http://sweet-yuri.forumactif.com/"><img src="http://img812.imageshack.us/img812/7827/38031868.png"></a><br></marquee></div></td>
</tr></table>

Merci.
Yuuko Nakami

Yuuko Nakami
**

Messages : 77
Inscrit(e) le : 20/05/2011

http://sweet-yuri.forumactif.com
Yuuko Nakami a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Infobulle problème.

Message par Yuuko Nakami Sam 18 Juin 2011 - 16:47

Désolée du double post mais en fait, c'est bon, j'y suis arrivée.
Yuuko Nakami

Yuuko Nakami
**

Messages : 77
Inscrit(e) le : 20/05/2011

http://sweet-yuri.forumactif.com
Yuuko Nakami a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum