這篇文章主要為大家展示了“如何解決jQuery的hover事件在IE中不停閃動的問題”,內(nèi)容簡而易懂,條理清晰,希望能夠幫助大家解決疑惑,下面讓小編帶領大家一起研究并學習一下“如何解決jQuery的hover事件在IE中不停閃動的問題”這篇文章吧。
創(chuàng)新互聯(lián)專注于鎮(zhèn)海網(wǎng)站建設服務及定制,我們擁有豐富的企業(yè)做網(wǎng)站經(jīng)驗。 熱誠為您提供鎮(zhèn)海營銷型網(wǎng)站建設,鎮(zhèn)海網(wǎng)站制作、鎮(zhèn)海網(wǎng)頁設計、鎮(zhèn)海網(wǎng)站官網(wǎng)定制、微信小程序服務,打造鎮(zhèn)海網(wǎng)絡公司原創(chuàng)品牌,更為您提供鎮(zhèn)海網(wǎng)站排名全網(wǎng)營銷落地服務。
在使用jQuery的hover事件時,經(jīng)常會因為鼠標滑動過快導致菜單不停閃動的情況,相信很多朋友都遇到過自己做的縱向下拉菜單不停的收縮,非常的討厭。今天在給一個網(wǎng)站設計菜單時也遇到了這個情況,結(jié)果在百度上找了N久,沒有找到解決方法。在這里吐槽一下,百度太2了,收錄的內(nèi)容都沒什么價值,最后還是在google找到了解決方法,下面就把這個jQuery的hover在IE中會導致不停閃動的解決方法教給大家。
$("#category ul").find("li").each( function() { $(this).mouseover( function() { $(this).children("ul").show(); } ); $(this).mouseout( function() { $(this).children("ul").hide(); } ); } );
鼠標在下拉菜單移動時菜單會不斷閃爍,說明不斷觸發(fā)了 mouseover 和 mouseout 事件。
其實很簡單的解決方法:將 mouseover 改成 mouseenter,mouseout 改成 mouseleave。mouseenter 和 mouseleave 事件是 jQuery 庫中實現(xiàn)的,并不是瀏覽器的原生事件。不過最重要的是把菜單不停閃動的問題解決了!
$("#category ul").find("li").each( function() { $(this).mouseenter(function() { $(this).children("ul").show(); } ); $(this).mouseleave(function() { $(this).children("ul").hide(); } ); } );
以上是“如何解決jQuery的hover事件在IE中不停閃動的問題”這篇文章的所有內(nèi)容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內(nèi)容對大家有所幫助,如果還想學習更多知識,歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道!