快捷導(dǎo)航

完美解決jQuery的hover事件在IE中不停閃動(dòng)的問(wèn)題

更新時(shí)間：2017年02月10日 10:19:03 投稿：jingxian

下面小編就為大家?guī)?lái)一篇完美解決jQuery的hover事件在IE中不停閃動(dòng)的問(wèn)題。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧

在使用jQuery的hover事件時(shí)，經(jīng)常會(huì)因?yàn)槭髽?biāo)滑動(dòng)過(guò)快導(dǎo)致菜單不停閃動(dòng)的情況，相信很多朋友都遇到過(guò)自己做的縱向下拉菜單不停的收縮，非常的討厭。今天在給一個(gè)網(wǎng)站設(shè)計(jì)菜單時(shí)也遇到了這個(gè)情況，結(jié)果在百度上找了N久，沒(méi)有找到解決方法。在這里吐槽一下，百度太2了，收錄的內(nèi)容都沒(méi)什么價(jià)值，最后還是在google找到了解決方法，下面就把這個(gè)jQuery的hover在IE中會(huì)導(dǎo)致不停閃動(dòng)的解決方法教給大家。

$("#category ul").find("li").each( function() { 
$(this).mouseover( function() {
$(this).children("ul").show(); 
} ); 
$(this).mouseout( function() {
$(this).children("ul").hide();
 } ); 
} );

鼠標(biāo)在下拉菜單移動(dòng)時(shí)菜單會(huì)不斷閃爍，說(shuō)明不斷觸發(fā)了 mouseover 和 mouseout 事件。

其實(shí)很簡(jiǎn)單的解決方法：將 mouseover 改成 mouseenter，mouseout 改成 mouseleave。mouseenter 和 mouseleave 事件是 jQuery 庫(kù)中實(shí)現(xiàn)的，并不是瀏覽器的原生事件。不過(guò)最重要的是把菜單不停閃動(dòng)的問(wèn)題解決了！

$("#category ul").find("li").each( function() {
 $(this).mouseenter(function() { 
$(this).children("ul").show(); 
} );
 $(this).mouseleave(function() {
 $(this).children("ul").hide();
 } ); 
} );

以上這篇完美解決jQuery的hover事件在IE中不停閃動(dòng)的問(wèn)題就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

jquery實(shí)現(xiàn)拖動(dòng)效果（代碼分享）
本文主要分享了jquery實(shí)現(xiàn)拖動(dòng)效果的示例代碼。具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧
2017-01-01
ASP.NET MVC中EasyUI的datagrid跨域調(diào)用實(shí)現(xiàn)代碼
因?yàn)閑asyUI使用的是JQuery的異步方法加載數(shù)據(jù)，應(yīng)該遵循JQuery的跨域訪問(wèn)規(guī)則
2012-03-03
jQuery實(shí)現(xiàn)標(biāo)題有打字效果的焦點(diǎn)圖代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)標(biāo)題有打字效果的焦點(diǎn)圖代碼,可實(shí)現(xiàn)幻燈片切換顯示時(shí)標(biāo)題同步逐個(gè)打印顯示的效果,涉及jQuery操作json格式數(shù)據(jù)及時(shí)間函數(shù)的相關(guān)技巧,需要的朋友可以參考下
2015-11-11
jQuery實(shí)現(xiàn)的模仿雨滴下落動(dòng)畫效果
這篇文章主要介紹了jQuery實(shí)現(xiàn)的模仿雨滴下落動(dòng)畫效果,涉及jQuery結(jié)合時(shí)間函數(shù)動(dòng)態(tài)修改頁(yè)面元素屬性相關(guān)操作技巧,需要的朋友可以參考下
2018-12-12
jquery實(shí)現(xiàn)郵箱自動(dòng)補(bǔ)全功能示例分享
這篇文章主要介紹了jquery實(shí)現(xiàn)郵箱自動(dòng)補(bǔ)全功能，大家參考使用吧
2014-02-02
jQuery ajax提交Form表單實(shí)例(附demo源碼)
這篇文章主要介紹了jQuery ajax提交Form表單的方法,結(jié)合實(shí)例分析了jQuery ajax操作實(shí)現(xiàn)表單提交的相關(guān)技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下
2016-04-04
EasyUI 中 MenuButton 的使用方法
在EasyUI 的Demo 中只有MenuButton 的顯示DEMO，沒(méi)有click 事件的相關(guān)操作，項(xiàng)目中正好用到啦，所以研究了下，可以用js 動(dòng)態(tài)的為menu item 綁定click 事件
2012-07-07
使用jQuery實(shí)現(xiàn)圖片輪播效果
這篇文章主要為大家詳細(xì)介紹了使用jQuery實(shí)現(xiàn)圖片輪播效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-02-02
修改UA在PC中訪問(wèn)只能在微信中打開(kāi)的鏈接方法
下面小編就為大家分享一篇修改UA在PC中訪問(wèn)只能在微信中打開(kāi)的鏈接方法，具有很好的參考價(jià)值。希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧
2017-11-11
Javascript技巧之不要用for in語(yǔ)句對(duì)數(shù)組進(jìn)行遍歷
Javascript技巧-不要用for in語(yǔ)句對(duì)數(shù)組進(jìn)行遍歷的一些原因分析，需要的朋友可以參考下。
2010-10-10