Bonjour,
je travaille aussi sur le sujet des infobulles-images. Apres des tests progressifs j'ai obtenu un script qui semble donner de bons resultats selon navigateur IE ou NS, selon taille de fenetre, selon position du lien. Voici l'extrait du script:
***********************************************
<div id=popbox>Chargement...</div>
<script type="text/javascript">
//selon image suit(ou non) curseur appliquer mousemove(ou mouseover)
if (navigator.appName=="Microsoft Internet Explorer")var nav="IE";
if (navigator.appName == "Netscape") var nav="NS";
if(navigator.appName == "NS") document.captureEvents(Event.mousemove);
document.onmousemove = pointer;
if (document.getElementById) var stylbox = document.getElementById("popbox").style;
// Temporary variables to hold mouse x-y pos.s
var posX = 0; var posY = 0;
function pointer() { //position x & y de la souris
posY =(nav=="IE")? event.clientY: e.pageY;
posX =(nav=="IE")? event.clientX: e.pageX;
// catch possible valeur negative en NS4
scrolY=(nav=="IE")?document.documentElement.scrollTop:document.body.scrollTop;
scrolX=(nav=="IE")?document.documentElement.scrollLeft:document.body.scrollLeft;
posY =(posY < 0)?posY = 0 :posY+scrolY ;
posX =(posX < 0)?posX = 0 :posX+scrolX ;
// recupere dimensions de l'image
imagx=document.getElementById('testx').innerHTML;
imagy=document.getElementById('testy').innerHTML;
//milieu de fenetre en scroll
fntr2X=(document.documentElement.clientWidth/2)+scrolX;
fntr2Y=(document.documentElement.clientHeight/2)+scrolY;
if (posX<(fntr2X)) {resuX="G";stylbox.left=posX+10+'px';} else {resuX="D";stylbox.left=posX-10-imagx+'px';}
if (posY<(fntr2Y)) {resuY="H";stylbox.top=posY-100+'px';} else {resuY="B";stylbox.top=posY+100-imagy+'px';}
return true;
}
function poplink(contenu,imgx,imgy){
if (document.getElementById){
document.getElementById('popbox').innerHTML = contenu;
stylbox.visibility = 'visible';
document.getElementById('centrage').style.visibility='hidden';
document.getElementById('testx').style.visibility='hidden';
document.getElementById('testx').innerHTML=imgx;
document.getElementById('testy').innerHTML=imgy;
} }
function closepopup(){
if (document.getElementById) stylbox.visibility = "hidden";
}
</script>
<div id="testx" style="position:absolute;left:0;top:0;background-color: #99FF99; layer-background-color: #FFF0F5;text-align:center; border: 1px none #000000;">Glissez la souris (sans-cliquer)<br>sur chaque image<br>...pour voir en grand format.</div>
<div id="testy" style="position:absolute;left:0;top:15px;visibility:hidden;"></div>
<div id="centrage"><img src="./photos/mini/z_00bananeperc.jpg"></div>
***********************************
le script est untilisé dans ==>
http://pyxel.info/percing/catsexe/percsexe.php5
voilà qui peut servir et probablement etre amelioré.
bonne journee. Pyxel