正常编写上下滑动动画

 $('.nav>li').mouseover(function () {
        $(this).children('ul').slideDown(200);
    });
    $('.nav>li').mouseout(function () {
        $(this).children('ul').slideUp(200);
    })

有点繁琐,于是知道了hover切换事件

$('.nav>li').hover(function () {
        $(this).children('ul').slideDown(200);
    },function () {
        $(this).children('ul').slideUp(200);
    })

感觉没啥变化呢

$('.nav>li').hover(function () {
        $(this).children('ul').stop().slideToggle(200);
    })

因为动画会持续执行,也叫动画排队,所以需要在下一个动画开始前停止上一个动画,在下一个动画前添加stop()

Last modification:February 23rd, 2020 at 08:13 pm