我目前正在制作一个包含菜单导航的网站,该菜单导航与在fotopunch.com上找到的几乎相同,而不是向下指向它。无论如何,我使用 jquery/javascript 为菜单编写了代码,它可以工作,但是在 fotopunch 网站上也出现了一个小错误。当您将光标从一个菜单项移动到另一个菜单项并反复返回时,它会暂时弄乱显示。有没有办法来解决这个问题?我将包含我的 javascript 文件的一部分,这样您就可以看到我为每个菜单项做了什么。
$("div#menu .reps").hover(function() {
//if the current slide is not reps
if(current_slide != "reps"){
//move the arrow to the corresponding position for the reps slide
$(".arrow").animate({"left":"135px"});//move the arrow
//(test which slide it is.)
if(current_slide == "clients"){
//fade out & hide the current slide
$(".clients_display").fadeOut().hide();//hide the current slide
//show the reps slide & fade in
$(".reps_display").fadeIn().show();//show the slide
//the current slide is the reps slide
current_slide = "reps";
}
else if(current_slide == "services"){
//fade out & hide the current slide
$(".services_display").fadeOut().hide();//hide the current slide
//show the reps slide & fade in
$(".reps_display").fadeIn().show();//show the slide
//the current slide is the reps slide
current_slide = "reps";
}
else{
//fade out & hide the current slide
$(".training_display").fadeOut().hide();//hide the current slide
//show the reps slide & fade in
$(".reps_display").fadeIn().show();//show the slide
//the current slide is the reps slide
current_slide = "reps";
}
}
});
我为每个菜单项执行此操作(有 4 个)。我认为问题在于当它淡出并淡入时,因为如果它试图同时做太多事情,它会同时显示 2 个菜单 div。我尝试添加超时但不成功。解决此错误的最佳方法是什么?它足够小,不是一个重要的优先事项,但让它更好地工作会很好。谢谢。