0

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

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

1 回答 1

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();
    }
}
});​
于 2012-06-05T18:30:25.703 回答