0

我目前正在制作一个小的淡入淡出子导航菜单。一切工作正常,除了当我鼠标悬停时,子导航菜单首先淡入,然后动画下来。我需要同时发生这种情况,所以我继续禁用队列,但由于某种原因它仍然会消失,然后按顺序动画:C。有趣的是:当我鼠标移出时,它会同时移动和消失!非常混乱。

$(document).ready(function(){
    $("ul.subNavMenu").fadeTo(0,0);
    $("ul.navMenu").hover(
        function() {
            $("ul.subNavMenu").animate({opacity: 1, marginTop: "20px"}, {duration: 1000, queue:false});
        },
        function() {
            $("ul.subNavMenu").animate({opacity: 0, marginTop: "0px"}, {duration: 1000, queue:false});
        }
    );
});

这是小提琴:http: //jsfiddle.net/Hmvd3/2/

有什么建议么?

4

2 回答 2

1

你可以试试stop()。

$("ul.navMenu").hover(
        function() {
            $("ul.subNavMenu").stop().animate({opacity: 1, marginTop: "20px"}, {duration: 1000, queue:false});
        },
        function() {
            $("ul.subNavMenu").stop().animate({opacity: 0, marginTop: "0px"}, {duration: 1000, queue:false});
        }
);
于 2012-08-16T01:03:29.580 回答
0

默认的缓动是swing。设置easing: 'linear'应该可以解决您的问题。

http://jsfiddle.net/nickaknudson/Hmvd3/

资源

于 2012-08-16T02:28:00.293 回答