2014年1月8日 星期三

jquery slideDown延遲展開,排除反覆顯示



$(document).ready(function(){
     var mouseover_tid = [];
     var mouseout_tid = [];






     $('ul.main_menu>li').hover(//第一層
           function(event){  //滑入

                var _self = this;
                // 停止卷起事件
                clearTimeout(mouseout_tid[$(this).index()]);
                // 當滑鼠滑入超过 0.4 秒, 即展開,並紀錄陣列 ID 中
                mouseover_tid[$(this).index()] = setTimeout(function() {
                      $(_self).find('ul.submenu').slideDown('fast');  //第二層展開
                }, 400);
           },
           function(event){    //滑出
                var _self = this;
                // 停止展開事件
                clearTimeout(mouseover_tid[$(this).index()]);
                // 當滑鼠離超過 0.4 秒, 即收起, 並記錄陣列 ID 中
                mouseout_tid[$(this).index()] = setTimeout(function() {
                      $(_self).find('ul.submenu').slideUp('fast'); //第二層收起
                }, 400);
          }
});










參考/延伸資料:


var t = setTimeout( function(){   m動作    }, n毫秒 );   達n秒執行m    只執行一次
clearTimeout(t);  停止執行m
Note: To be able to use the clearTimeout() method, you must use a global variable when creating the timeout method


http://www.cnblogs.com/ishibin/archive/2013/01/30/2883822.html  
http://www.w3schools.com/jsref/met_win_settimeout.asp
http://www.w3schools.com/jsref/met_win_cleartimeout.asp




var s = setInterval(function, 1000) 每秒執行
window.clearInterval(s); 
http://yiyingloveart.blogspot.tw/2013/04/settimeout-setinterval.html
http://www.w3school.com.cn/htmldom/met_win_setinterval.asp







沒有留言:

張貼留言