这是我正在谈论的网站：http: //benjaminpotter.org/clients/c3carlingford/
因此，我正在构建一个菜单，当您将鼠标悬停在菜单项上时会出现弹出窗口：
所以我写了一个 javascript (jQuery) 函数来动画它：
$(".info").css({"opacity": "0", "margin-top": "10px"}).hide(0);
$("#menu-item-51").mouseenter(function(){
$(".nav1").stop(0).show(0).delay(300).animate({"opacity": "1", "margin-top": "-3px"}, {"duration": (250)});
});
$("#menu-item-51").mouseleave(function(){
$(".nav1").stop(0).show(0).delay(0).animate({"opacity": "0", "margin-top": "10px"}, {"duration": (150)});
});
$("#menu-item-11").mouseenter(function(){
$(".nav2").stop(0).show(0).delay(300).animate({"opacity": "1", "margin-top": "-3px"}, {"duration": (250)});
});
$("#menu-item-11").mouseleave(function(){
$(".nav2").stop(0).show(0).delay(0).animate({"opacity": "0", "margin-top": "10px"}, {"duration": (150)});
});
$("#menu-item-12").mouseenter(function(){
$(".nav3").stop(0).show(0).delay(300).animate({"opacity": "1", "margin-top": "-3px"}, {"duration": (250)});
});
$("#menu-item-12").mouseleave(function(){
$(".nav3").stop(0).show(0).delay(0).animate({"opacity": "0", "margin-top": "10px"}, {"duration": (150)});
});
$("#menu-item-13").mouseenter(function(){
$(".nav4").stop(0).show(0).delay(300).animate({"opacity": "1", "margin-top": "-3px"}, {"duration": (250)});
});
$("#menu-item-13").mouseleave(function(){
$(".nav4").stop(0).show(0).delay(0).animate({"opacity": "0", "margin-top": "10px"}, {"duration": (150)});
});
$("#menu-item-14").mouseenter(function(){
$(".nav5").stop(0).show(0).delay(300).animate({"opacity": "1", "margin-top": "-3px"}, {"duration": (250)});
});
$("#menu-item-14").mouseleave(function(){
$(".nav5").stop(0).show(0).delay(0).animate({"opacity": "0", "margin-top": "10px"}, {"duration": (150)});
});
$("#menu-item-15").mouseenter(function(){
$(".nav6").stop(0).show(0).delay(300).animate({"opacity": "1", "margin-top": "-3px"}, {"duration": (250)});
});
$("#menu-item-15").mouseleave(function(){
$(".nav6").stop(0).show(0).delay(0).animate({"opacity": "0", "margin-top": "10px"}, {"duration": (150)});
});
所以首先存在的问题是它有很多代码......但它有效......
那么问题是什么？
问题是这样的：
当您在所有链接上向后和第四个鼠标时，它会级联。酷我知道，但客户不喜欢它。我也不。
那么如何更改它以使其表现更好呢？
我希望它像这样工作：
他们的下拉菜单不一样：鼠标悬停，级联的东西......
你可以在这里查看他们的网站：http: //thecity.org/