Salut,
J'utilise la fonction suivante pour afficher une info-bulle dans mes pages.
//***************************************************************************************************
/*Affiche une info-bulle qui suit la souris*/
/*
//MOVE this to the <body>:
<div id="toolTipLayer" style="position:absolute; visibility: hidden"></div>
<script language="JavaScript">initToolTips();</script>
//MOVE this into the <balise (DIV de préférence)>
onMouseOver="toolTip('', 'infobulle1')" onMouseOut="toolTip()" class="information"
*/
var ns4 = document.layers;
var ns6 = document.getElementById && !document.all;
var ie4 = document.all;
offsetX = 0;
offsetY = 20;
var toolTipSTYLE="";
function initToolTips()
{
if(ns4||ns6||ie4)
{
if(ns4) toolTipSTYLE = document.toolTipLayer;
else if(ns6) toolTipSTYLE = document.getElementById("toolTipLayer").style;
else if(ie4) toolTipSTYLE = document.all.toolTipLayer.style;
if(ns4) document.captureEvents(Event.MOUSEMOVE);
else
{
toolTipSTYLE.visibility = "visible";
toolTipSTYLE.display = "none";
}
document.onmousemove = moveToMouseLoc;
}
}
function toolTip(msg, cssclass)
{
if(toolTip.arguments.length < 1) // hide
{
if(ns4) toolTipSTYLE.visibility = "hidden";
else toolTipSTYLE.display = "none";
}
else // show
{
if(!cssclass) cssclass = "infobulle1";
var content =
'<table border="0" cellspacing="0" cellpadding="1" class="' + cssclass +
'"><td align="left">' + msg +
'</td></table>';
if(ns4)
{
toolTipSTYLE.document.write(content);
toolTipSTYLE.document.close();
toolTipSTYLE.visibility = "visible";
}
if(ns6)
{
document.getElementById("toolTipLayer").innerHTML = content;
toolTipSTYLE.display='block'
}
if(ie4)
{
document.all("toolTipLayer").innerHTML=content;
toolTipSTYLE.display='block'
}
}
}
function moveToMouseLoc(e)
{
if(ns4||ns6)
{
x = e.pageX;
y = e.pageY;
}
else
{
x = event.x; + document.body.scrollLeft;
y = event.y; + document.body.scrollTop;
}
toolTipSTYLE.left = x + offsetX;
toolTipSTYLE.top = y + offsetY;
return true;
}
Sur une page, je peux avoir plusieurs liens appelant cette fonction...
Mon problème est que lorsque je descend mon ascenceur pour visualiser le bas de ma page et que je survole un lien info-bulle, la distance entre le calque info-bulle et le pointeur de ma souris est aussi important que la distance parcourue par l'ascenceur !! En bref, si ma page fait 2 fois la hauteur de l'écran ou plus, je vois plus mon info-bulle...
Quelqu'un a-t-il une solution à ce problème ?? Merci
Romulus
Partager