jquery菜单幻灯片验证悬停功能

Question

我一直在尝试调整菜单幻灯片并在下面显示我的部分代码，我分别为菜单中的 4 个项目中的每一个项目提供了代码。我这样做了，如果您将光标移动到给定的菜单项上，相应的 div 就会显示在显示屏中。我还添加了超时，因此如果您快速从一个菜单项移动到另一个菜单项，它不会很快从一个 div 切换到另一个。我现在必须让它完全按照需要工作的问题是 我如何让它检查光标是否在 200 毫秒后仍然悬停在给定的菜单项上，例如在切换到该菜单项之前？ 感谢任何 cmets 或帮助。谢谢。

$("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";
        }
    }
}

Answer 1

大概是这样的：

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();
    }
}
});​