Zde je skript Greasemonkey, na kterém pracuji (zdroj níže):http://userscripts.org/scripts/show/69722
Můžete si to vyzkoušet na této stránce:http://forums.whirlpool.net.au/forum/35
Umístěte ukazatel myši na název vlákna a zobrazí se div s náhledem.
Zvláštní je, že když pohybujete myší na div, mouseout
událost se z nějakého důvodu spouští.
Má někdo nějaké nápady, proč se to děje?
// ==UserScript== // @name Whirlpool Mouseover Thread Title // @namespace blurg! // @description Whirlpool Mouseover Thread Title Preview // @include http://forums.whirlpool.net.au/forum/* // @version 0.2 // ==/UserScript== var tPrev={ reginald:document.URL.match(new RegExp(//100$|/82$|/9$|/107$|/135$|/80$|/136$|/125$|/116$|/63$|/127$|/139$|/7$|/129$|/130$|/131$|/10$|/38$|/39$|/91$|/87$|/112$|/132$|/8$|/83$|/138$|/58$|/106$|/126$|/35$|/92$|/137$|/114$|/123$|/128$|/18$|/14$|/15$|/68$|/72$|/69$|/94$|/90$|/102$|/105$|/109$|/119$|/108$|/31$|/67$|/5$/)), grabTrs:document.querySelectorAll("#threads>table>tbody>tr:not(.pointer):not(.deleted):not(.section) a.title"), element:null, threadNum:null, modal:document.createElement('div'), modalFunc:null, modalReset:null, onModal:null, mouseoot:false, mousePos:{ y:0, x:0 }, tyme:{ over:0, out:0 }, sTo:null }; if(tPrev.reginald){ GM_addStyle('#tPrev_modal{position:absolute;z-index:50;width:500px;height:200px;background-color:white;border:3px solid grey;display:none;overflow:scroll;font-size:0.8em;}.advertising_block{display:none !important;}'); tPrev.modal.setAttribute('id','tPrev_modal'); document.body.appendChild(tPrev.modal); /*console.log(tPrev.onModal); tPrev.modalReset=function(w){ clearInterval(tPrev.sTo); if(w=='link' && tPrev.onModal){ return; } if(w=='div'){ tPrev.onModal=false; } };*/ [].forEach.call(tPrev.grabTrs, function (item) { item.addEventListener('mouseover',function(e){ tPrev.element=this; //tPrev.findMousePosition(e); tPrev.mousePos.x = e.clientX+window.pageXOffset; tPrev.mousePos.y=(e.clientY+window.pageYOffset)-50; tPrev.threadNum=tPrev.element.href.split('t=')[1]; tPrev.tyme.over=Date.now(); tPrev.sTo=setInterval(function(){ if((Date.now()-tPrev.tyme.over)>2000){ clearInterval(tPrev.sTo); tPrev.modal.style.display='block'; tPrev.modal.style.left=tPrev.mousePos.x+'px'; tPrev.modal.style.top=tPrev.mousePos.y+'px'; //tPrev.onModal=true; GM_xmlhttpRequest({ method: "GET", url: 'http://74.125.155.132/search?q=cache:forums.whirlpool.net.au/forum-replies-archive.cfm/'+tPrev.threadNum+'.html', onload: function(r) { var rt=r.responseText; var inOf = rt.indexOf('<td class="bodyuser">'); if(inOf>-1){ var iH1=rt.substring(inOf,rt.indexOf('<div class="footbar">')); tPrev.modal.innerHTML='<tbody><tr>'+iH1; //console.log('onload '+tPrev.onModal); } else{ tPrev.modal.innerHTML='<p style="font-size:1.5em;">Preview not available</p>'; } }, onerror: function(e) { tPrev.modal.innerHTML='<p style="font-size:1.5em;">Preview not available</p>'; } }); } },50); }, false); item.addEventListener('mouseout',function(e){ clearInterval(tPrev.sTo); //console.log('item mouseout '+tPrev.onModal); }, false); }); //tPrev.modal.addEventListener('mouseover',function(e){tPrev.onModal=true;console.log('tPrev mouseout '+tPrev.onModal);}, false); tPrev.modal.addEventListener('mouseover',function(e){ console.log('tPrev mouseover '); }, false); tPrev.mouseoot=tPrev.modal.addEventListener('mouseout',function(ev){ console.log('tPrev mouseout '); /*tPrev.element=null; tPrev.modal.innerHTML=''; tPrev.modal.style.display='none'; tPrev.tyme.over=0;*/ //this.removeEventListener('mouseout', tPrev.mouseoot, false); }, false); }
Odpověď
Toto je jeden z problémů s mouseout vs mouseleave. (Jedno místo, IE udělal něco správně. Představte si to!)
Mouseout se spustí, když se přesunete do podřízeného prvku, zatímco mouseleave se spustí pouze tehdy, když se přesunete mimo prvek A všechny podřízené prvky.
Další informace najdete na http://www.quirksmode.org/dom/events/index.html#t28.