#test { background-color: #f00; width: 120px; padding: 1px; } .foo { padding: 10px; width: 100px; background-color: #fff; }
(Mootools)
window.addEvent('domready', function(){ $('test').addEvent('mouseout', function(){ console.log('ALERT!!'); }); $$('.foo').addEvent('mouseout', function(e){ e.stopPropagation(); }); });
Chodzi o to, że chce odpalić jakąś funkcję tylko i wyłącznie kiedy myszka zjedzie z całego kontenera #test. Jednak ze względu na to, że ten div ma jedynie padding: 1px to jeśli dość szybko zjadę z niego myszką to event się nie wykona. Dodatkowo event wykonuje się także jak najadę myszką na kontener. Natomiast jeśli usunę padding (divy .foo zajmują całą powierzchnię #test) to zdarzenie w ogóle nie będzie się odpalać.
Live przykład
Generalnie chodzi mi o tego scrollera, ma to działać tak, że po najechaniu na niego zaczyna działać, a po zjechaniu przestaje. Odpalcie firebuga i najedźcie na obszar ze zdjęciami pozostawiając myszkę w jednym miejscu na obrazku. Za każdym razem kiedy pod myszką następuje zmiana obrazków jest odpalany event mouseout a następnie mouseover, a chce żeby odpalało się tylko dla głównego kontenera. Jakieś pomysły?