tooltip

2005. 11. 08.

kis javascript következik. feladat: egyszerű tooltip. nyugalom. lightos lesz és senki sem fog megsérülni.

lássuk mi kell a jsbe:

• mouseover megjelenik a tooltipttOver=function(e){tt.style.display="block"}
• mousemove mozog a tooltip ttMove=function(e){ if (!e){e=window.event}; m={x:e.clientX,y:e.clientY} tt.innerHTML=texts[this.i] tt.style.top=m.y+20 tt.style.left=m.x }
• mouseouteltünik a tooltipttOut=function(e){tt.style.display="none"}
• init inicializáljunk ttInit=function(){ if(texts){ spans=document.getElementsByTagName("span") tt=document.getElementById("ttId") for (s=0;s<spans.length;s++){ spans[s].onmouseover=ttOver spans[s].onmouseout=ttOut spans[s].onmousemove=ttMove spans[s].i=s } } } </ul> a tooltipek szövegeit meg az oldalban definiáljuk : texts=[ "ez az első span tooltipje", "ez meg a másiké" ] no meg persze cssben határozzuk meg a megjelenést. na szóval hogy is van ez : a span tagek tooltipet kapnak. texts tömből veszik a szöveget létrejöttük sorrendjében. ennyi. mondtam hogy lightos cucc, és ugye hogy nem is volt balhés. eredmény erre. ## Comments (1) ### ys - 2005-11-08 12:57:52 WARN : a code highlight xar. tessék a linkelt fileokat nézni! nem todtok egy jó highlight plugint wordpresshez?