IM.Tooltip // Teste de colisão com selects
Implementei com base nela um esquema de Tooltips, baseado em um script que não me recordo onde peguei.
Com isso as selects que estiverem atrás dessa tooltip somem quando ela é mostrada.
Esse esquema transforma atributos title="" de elementos <a> em tooltips.
1 2 IM = {} 3 /* Utils 4 ***************************************************************************/ 5 IM.Utils = { 6 hitTest: function(o, l){ 7 function getOffset(o){ 8 for(var r = {l: o.offsetLeft, t: o.offsetTop, r: o.offsetWidth, b: o.offsetHeight}; 9 o = o.offsetParent; r.l += o.offsetLeft, r.t += o.offsetTop); 10 return r.r += r.l, r.b += r.t, r; 11 } 12 for(var b, s, r = [], a = getOffset(o), j = isNaN(l.length), i = (j ? l = [l] : l).length; i; 13 b = getOffset(l[--i]), (a.l == b.l || (a.l > b.l ? a.l <= b.r : b.l <= a.r)) 14 && (a.t == b.t || (a.t > b.t ? a.t <= b.b : b.t <= a.b)) && (r[r.length] = l[i])); 15 return j ? !!r.length : r; 16 }, 17 setOpacity: function(el, op){ 18 el.style.filter="alpha(opacity:"+op+")"; 19 el.style.KHTMLOpacity="0."+op; 20 el.style.MozOpacity="0."+op; 21 el.style.opacity="0."+op; 22 }, 23 showElement: function(x) { // show element ( object element ) 24 x.style.display = "block"; 25 if(!x.ieFix) 26 x.ieFix = IM.Utils.hitTest(x, d.getElementsByTagName("select")); 27 for(var i = x.ieFix.length; i; x.ieFix[--i].style.visibility = "hidden"); 28 }, 29 hideElement: function(x) { // hide element ( object element ) 30 x.style.display = "none"; 31 if (x.ieFix) 32 for(var i = x.ieFix.length; i; x.ieFix[--i].style.visibility = "visible"); 33 } 34 }; 35 36 37 /* Tooltip 38 ***************************************************************************/ 39 IM.Tooltip = { 40 init: function(id) { 41 var links,i,h; 42 if(!d.getElementById || !d.getElementsByTagName ) return; 43 if(!$(id)) return; 44 h = IM.DOM.cE("span"); 45 h.setAttribute("id",'im-tooltip'); 46 h.style.position="absolute"; 47 if ( $('im-tooltip') ) Element.remove("im-tooltip"); 48 d.getElementsByTagName("body")[0].appendChild(h); 49 if(id==null) links=d.getElementsByTagName("a"); 50 else links=($(id)).getElementsByTagName("a"); 51 for(i=0;i<links.length;i++){ 52 this.load(links[i]); 53 } 54 }, 55 load: function(el) { 56 var tooltip,t,b,s,l; 57 t=el.getAttribute("title"); 58 if(t==null || t.length==0) return; 59 el.removeAttribute("title"); 60 tooltip=this.cE("span","tooltip"); 61 s=this.cE("span","top"); 62 s.appendChild(d.createTextNode(t)); 63 tooltip.appendChild(s); 64 b=this.cE("b","bottom"); 65 tooltip.appendChild(b); 66 IM.Utils.setOpacity(tooltip, '90'); 67 el.tooltip=tooltip; 68 el.onmouseover=this.sT; 69 el.onmouseout=this.hT; 70 el.onmousemove=this.pos; 71 }, 72 sT: function(e) { // showTooltip 73 var x = $('im-tooltip'); 74 x.appendChild(this.tooltip); 75 IM.Tooltip.pos(e); 76 }, 77 hT: function(e) { // hideTooltip 78 var d = $('im-tooltip'); 79 if(d.childNodes.length>0) d.removeChild(d.childNodes[0]); 80 if (d.ieFix) 81 for(var i = d.ieFix.length; i; d.ieFix[--i].style.visibility = "visible"); 82 }, 83 cE: function(t,c) { 84 var x = d.createElement(t); 85 x.className = c; 86 x.style.display="block"; 87 return(x); 88 }, 89 pos: function(e) { 90 var posx=0,posy=0; 91 if(e==null) e=window.event; 92 posx = Event.pointerX(e); 93 posy = Event.pointerY(e); 94 var x = $('im-tooltip'); 95 x.style.top=(posy+10)+"px"; 96 x.style.left=(posx-20)+"px"; 97 if(!x.ieFix) 98 x.ieFix = IM.Utils.hitTest(x, d.getElementsByTagName("select")); 99 for(var i = x.ieFix.length; i; x.ieFix[--i].style.visibility = "hidden"); 100 } 101 }