Sujet déplacé le dimanche 27 avril 2008 : 20:09Bonjour,
Je cherchais à mettre à coté de ma souris dans une infobulle une image.
Le code marche très bien sauf dans kwsphp... et c'est là que j'en ai besoin. Pas de bol...
Mon infobulle ne suit pas ma souris !
Je pense que c'est un code dans kwsphp qui prend le dessus sur mon code.
Est ce que les developpeurs de kwsphp pourraient m'aider ?
J'ai mis un lien sur ma page test
http://mecatools.dfournier.free.fr/index.php?mod=testla meme page qui marche avec le meme code hors kwsphp
http://mecatools.dfournier.free.fr/modules/test/test.htmlCode PHP :
Pour copier le contenu exact du code,
Veuillez citer le message
- <? open_table(); ?>
-
- <style type="text/css">
- .clBulle
- { display: none;
- position: absolute;
- z-index : 1;
- background-color: #F4F49C;
- padding: 2px;
- margin: 2px;
- border-style: ridge;
- border-width: 3px;
- border-color: #F4F49C;
- font-family: Arial;
- font-size: 8pt; }
- .mesDiv
- { background-color: #B3C2A1;
- padding: 10px; }
- .monStyle1
- { width: 100%;
- height: 60px; }
- .monStyle2
- { width: 220px; }
- </style>
-
- <script type="text/javascript">
- function MouseOver(ev)
- {
- var Xdoc, Xfen, Ydoc, Yfen, htDiv, lgDiv, dX, dY;
- var Ybulle;
- var el=document.getElementById("Bulle");
-
- //on affiche la boite de dialogue pour evaluer ses dimensions.
- if (el.style.display!="inline") {el.style.display="inline";}
-
- //hauteur et largeur de la bulle
- htDiv = el.offsetHeight;
- lgDiv = el.offsetWidth;
-
- //delta de la bulle sous la souris
- dY=10;
- dX=10;
-
- //position de la souris :
- Xfen = ev.clientX;
- Xdoc = Xfen + document.body.scrollLeft;
-
- Yfen = ev.clientY;
- Ydoc = Yfen + document.body.scrollTop;
-
- //position de la bulle dans la page :
- if ((Xfen + lgDiv + dX) > document.body.clientWidth)
- {el.style.left = document.body.clientWidth + document.body.scrollLeft - lgDiv;}
- else
- {el.style.left = Xdoc + dX;}
-
- if ((Yfen + htDiv + dY) > document.body.clientHeight)
- { Ybulle = document.body.clientHeight + document.body.scrollTop - htDiv-5;
- if (parseInt(Ybulle)>parseInt(Ydoc))
- { el.style.top = Ybulle;}
- else
- { el.style.top = Ydoc - htDiv-dY;}
- }
- else
- { el.style.top = Ydoc + dY-5;}
-
- //contenu de la bulle :
- el.innerHTML = " Xdoc= "+Xdoc+" px ; Ydoc= "+Ydoc+" px<br>";
- el.innerHTML+= " Xfen= "+Xfen+" px ; Yfen= "+Yfen+" px";
- }
-
- function MouseOut()
- { //on cache la bulle
- document.getElementById("Bulle").style.display = "none";}
- </script>
-
- <div class="clBulle" id="Bulle">Mon info-bulle</div>
-
- <div class="mesDiv monStyle1" onmousemove="MouseOver(event)" onmouseout="MouseOut()">
- ici l�info bulle se déplace avec la souris lorsque vous survolez ce paragraphe... <br>
- Déplacer l�ascenseur horizontal et repositionnez la souris sur le paragraphe. Lisez Xdoc et Xfen.... ;-)
- </div>
- <br>
- <div class="mesDiv monStyle2" onmouseover="MouseOver(event)" onmouseout="MouseOut()">
- par contre ici, l�info-bulle apparaît et reste fixe jusqu�à ce que vous sortiez du paragraphe.
- </div>
- <br>
- <div class="mesDiv monStyle2" onmousemove="MouseOver(event)" onmouseout="MouseOut()">
- ici l�info bulle se déplace avec la souris lorsque vous survolez ce paragraphe... <br>
- Déplacer l�ascenseur horizontal et repositionnez la souris sur le paragraphe. Lisez Xdoc et Xfen.... ;-)
- </div>
-
- <? close_table(); ?>
Edité Mardi 14 novembre 2006 :18:18 par foupoudaveEdité dimanche 27 avril 2008 : 19:57 par karim10