[Java Script] Lien avec infobulle...

Version imprimable

09/02/2006, 16h18
greg1386

[Java Script] Lien avec infobulle...

Bonjour a tous ^^ voila je cherche un moyen de fair des infobulles sur un lien cette infobulle afichera le contenue d'une variable php et qui peut aficher des image avec le code <img src=""> ( qui se trouve dans ma variable ) du html le tout dans un tableau ...

voila je vous remerci d'avance @++ tout le monde

ps :
Voila un lien dans une table

Code:

Echo "<table><tr><td><a href="www.google.fr"></td></tr></table>";

ma variable dit : $desc contien

Code:

test0000 ^^ <img src="http://www.google.com/images/logo_sm.gif"> c tous ^^
09/02/2006, 16h27
SpaceFrog

un div en display:none sur la page que tu remplis avec ton texte et ton image, que tu positionnes et que tu rend visible ... display:block ...
09/02/2006, 16h34
greg1386

lol merci d'avoir rep j'ai oublier de precisser je conais rien du tout en java script... sa fait que j'ai rien compris a ton msg ^^ mais merci quand meme
09/02/2006, 16h51
franculo_caoulene

Personnellement, je ne comprends rien à ton message qui est censé être en français d'après les règles du forum.
09/02/2006, 17h02
greg1386

:lol: desoler ^^

Ce que je veus en clair c s'avoir comment je peut fair pour aficher une sorte d'info bulle qui gere le code HTML qui m'afichera le contenue d'une de mes variables PHP quand je passe le pointeur sur un lien ... voila ^^ ++

un petit exemple vite fait :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<script type='text/javascript'>
var Mabulle
function showBulle(ici){
Mabulle=document.getElementById('infobulle');
Mabulle.style.top=ici.offsetTop-10+"px";
Mabulle.style.left=ici.offsetLeft+10+"px";
Mabulle.innerHTML=ici.getAttribute('bullemsg')
Mabulle.style.display="block";
}
</script>
 
</head>
 
<body>
<div style="display:none; height:auto; width:auto; position:absolute; z-index:3;background-color:palegreen" id="infobulle"></div>
<div onmouseover="showBulle(this)" onmouseout="Mabulle.style.display='none'" bullemsg="coucou" style="position:absolute; top:100px; left:200px" > ici </div>
<div onmouseover="showBulle(this)" onmouseout="Mabulle.style.display='none'" bullemsg="je suis là" style="position:absolute; top:150px; left:100px" > ici </div>
<div onmouseover="showBulle(this)" onmouseout="Mabulle.style.display='none'" bullemsg="par ici" style="position:absolute; top:200px; left:600px" > ici </div>
<div onmouseover="showBulle(this)" onmouseout="Mabulle.style.display='none'" bullemsg="il repassera par là" style="position:absolute; top:750px; left:200px" > ici </div>
<div onmouseover="showBulle(this)" onmouseout="Mabulle.style.display='none'" bullemsg="à la prochaine" style="position:absolute; top:400px; left:50px" > ici </div>
<div onmouseover="showBulle(this)" onmouseout="Mabulle.style.display='none'" bullemsg="enfin bon !" style="position:absolute; top:500px; left:180px" > ici </div>
 
</body>
</html>

09/02/2006, 21h15
greg1386

Merci ^^ sa marche j'ai adapter un peu a mon utilisation et a ma couleur et c bon :D