Probleme beim Positionieren Tooltip,
WernerK
- javascript
Hallo
ich arbeite noch relativ neu mit Javascript, bzw. manches ist mir einfach noch nicht so vertraut.
Ich möchte einen erweiteren Tooltip neben einem Bild anzeigen lassen.
Folgender Code:
<body>
..
<form>
...
<img src="../image/need.gif" width="24" height="24" alt="needed" id="needed" onmouseover="showImgTooltip('Dieser Text soll angezeigt werden');" onmouseout="hideImgTooltip();">
Der JS Code:
--------------------
function showImgTooltip(text){
varobj = document.createElement ("div");
varobj.id = "tooltipimg";
document.body.appendChild (varobj);
this.varobj.innerHTML = text;
}//function
function hideImgTooltip(){
if(document.getElementById('tooltipimg')){
varobj = document.getElementById('tooltipimg');
varobj.style.display= 'none';
}
}
Das CSS dazu:
----------------
#tooltipimg {
position: relative;
background: #ffd;
border:1px solid #000000;
font: 12px Verdana, sans-serif;
text-align: left;
line-height: 1.5em;
width: 150px;
}
Das funktioniert soweit. Nur wird der Tooltip nicht direkt neben dem Bild sondern irgendwo ganz links unten im Fenster angezeigt.
Wie könnte man dies hinbekommen, dass der Tooltip neben dem Bild erscheint?
Gruss
Werner
Hallo,
Wie könnte man dies hinbekommen, dass der Tooltip neben dem Bild erscheint?
Indem du jedes einzelne in ein <div> sperrst und so nur die <div> nebeneinandersetzen brauchst...
MfG. Christoph