Posted By

Leech on 07/21/06


Tagged

class tooltip


Versions (?)

Who likes this?

18 people have marked this snippet as a favorite

alexsancho
jkochis
kgosser
visualAesthetic
vali29
SpinZ
gAmUssA
hans
jeremyhcobb
palimadra
ckayra
fyreflyX
seanpowell
dekehooper
aegony
guo3823538
wirenaught
ringo380


Tool Tip v1.1


 / Published in: JavaScript
 

URL: http://jsfromhell.com/dhtml/tooltip

Displays a tooltip when the mouse is over an element. Created: 2005.08.07 - Modified: 2005.11.28

  1. /**************************************
  2. * Jonas Raoni Soares Silva
  3. * http://www.joninhas.ath.cx
  4. **************************************/
  5.  
  6. //========================================================
  7. // REQUIRES http://www.jsfromhell.com/geral/event-listener
  8. //========================================================
  9.  
  10. ToolTip = function(o, t, c, f){ //v1.1
  11. var i, $ = this;
  12. $.s = ($.o = document.createElement("div")).style;
  13. $.s.display = "none", $.s.position = "absolute", $.o.className = c, $.t = t, $.f = f;
  14. for(i in {mouseout: 0, mouseover: 0, mousemove: 0})
  15. addEvent(o, i, function(e){$[e.type](e);});
  16. };
  17. with({p: ToolTip.prototype}){
  18. p.update = function(e){
  19. var w = window, b = document.body;
  20. this.s.top = e.clientY + (w.scrollY || b.scrollTop || b.parentNode.scrollTop || 0) + "px",
  21. this.s.left = e.clientX + (w.scrollX || b.scrollLeft || b.parentNode.scrollLeft || 0) + "px";
  22. }
  23. p.mouseout = function(){
  24. this.s.display = "none";
  25. };
  26. p.mouseover = function(e){
  27. this.s.display = "block", document.body.appendChild(this.o).innerHTML = this.t,
  28. e.stopPropagation(), this.update(e);
  29. };
  30. p.mousemove = function(e){
  31. this.f && this.update(e);
  32. };
  33. }

Report this snippet  

You need to login to post a comment.