2019獨角獸企業重金招聘Python工程師標準>>>

一般我們有動態的比如 一個 div 點擊 其他一個 或者是 鼠標移動到另一個 div時候， 淡入淡出動畫，或者是其他動畫 。顯示或者隱藏。 當然如果使用 CSS3動畫那就更好了，那樣BUG是沒有的。

可是會發現如果我們操作比較頻繁的時候，就會發現動畫就一直在無腦執行，自動操作很多次。這不是我們想要的：

解決辦法：

下面是一個 ?鼠標移動 移出 div ? 淡入淡出或者是隱藏 的效果例子 js部分：

//鼠標經過 標題顯示 div 隱藏就隱藏

//鼠標移動事件 推薦使用 hover（） 如果是其他事件容易出現BUG的
? ? $("#thingContent").hover(function(event) {
? ? ? ? //$("#thinkStandard").show();
? ? ? ? // event.preventDefault(); //這里不可以，連 基本效果都沒有

? ? ? ? //event.stopPropagation(); 這個不行

? ? ? ? $("#thinkStandard").stop(true).fadeIn();
? ? }, function(event) {
? ? ? ? // $("#thinkStandard").hide();
? ? ? ? // event.preventDefault();
? ? ? ? //event.stopPropagation();?

? ? ? ? // stop(true) 表示 停止所有的同級隊列，如果不為ture 那么會將當前的動畫執行完才會執行下去的
? ? ? ? $("#thinkStandard").stop(true).fadeOut(3000);
? ? ? ? // $("#thinkStandard").stop().fadeOut(3000); stop阻止同級別的事件

? ? });

詳情請看 jq ?stop() 方法和 hover 方法

轉載于:https://my.oschina.net/u/2419285/blog/794736

總結

以上是生活随笔為你收集整理的jq 解决 动画 淡入淡出，隐藏显示，多次操作BUG的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。