2012-06-05 49 views
0

我一直在嘗試調整菜單幻燈片,並有我的代碼的一部分顯示在下面,我分別對菜單中的每個4項。我做到了這一點,如果將光標移動到給定的菜單項上,相應的div將顯示在顯示屏中。我還添加了一個超時時間,所以如果你從一個菜單項移動到另一個菜單項,它不會很快從一個div切換到另一個。我現在想要使其完全按照需要工作的問題是我該如何使它能夠檢查光標是否仍然在200毫秒後懸停在給定的菜單項上,例如在切換到該菜單項之前?任何意見或幫助表示讚賞。謝謝。jquery菜單幻燈片驗證懸停功能

$("div#menu .reps").hover(function() { 
    window.clearTimeout(timeoutID); 
    timeoutID = window.setTimeout(hoverFunctionReps, 280); 
}); 

function hoverFunctionReps(){ 
    if(current_slide != "reps"){ 

     $(".arrow").animate({"left":"135px"}); 

     if(current_slide == "clients"){ 
      $(".clients_display").stop(true,true).fadeOut().hide(); 
      $(".reps_display").fadeIn().show(); 
      current_slide = "reps"; 
     } 
     else if(current_slide == "services"){ 
      $(".services_display").stop(true,true).fadeOut().hide(); 
      $(".reps_display").fadeIn().show(); 
      current_slide = "reps"; 
     } 
     else{ 
      $(".training_display").stop(true,true).fadeOut().hide(); 
      $(".reps_display").fadeIn().show(); 
      current_slide = "reps"; 
     } 
    } 
} 

回答

0

也許是這樣的:

http://jsfiddle.net/lucuma/ZgNKG/

VAR timeoutID;

$(document).ready(function() { 
$("a").hover(function() { 
    window.clearTimeout(timeoutID); 
    $(this).data('hashover', '1'); 
    var that = this; 
    timeoutID=window.setTimeout(
     (function() { 
     hoverFunctionReps(that); 
     }), 280); 

}, function() { 
    $('span', this).hide(); 
    $(this).data('hashover', '0'); 
}); 

function hoverFunctionReps(me) { 
    if ($(me).data('hashover') == '1') { 
     $('span', me).show(); 
    } 
} 
});​ 
+0

我只是有時間在代碼中實現這一點,它的工作!非常感謝。這幫助我理解了以前沒有獲得的JavaScript的幾個部分。 – fudge22it