Jquery动画以一种方式工作,而不是另一种方式

jquery animation works one way but not the other?

本文关键字:方式 工作 另一种 一种 动画 Jquery      更新时间:2023-09-26

我有这个过渡来滑动侧边栏菜单。它似乎只在第一次点击时工作,当它从禁用到活动。但在出来的时候,它只是跳回到原来的位置,没有过渡。有什么建议吗?

if (sideMenu.hasClass('is-disabled')) {
    console.log('working 2');
    sideMenu.removeClass('is-disabled');
    sideMenu.addClass('is-active');
    sideMenu.animate({
        right: "0"
    }, 1000, function() {
        // Animation complete.
    });
}
else if (sideMenu.hasClass('is-active')){
    console.log('working 3');
    sideMenu.removeClass('is-active');
    sideMenu.addClass('is-disabled');
    sideMenu.animate({
        right: "-300px"
    }, 1000, function() {
        // Animation complete.
    });
}

不知道如何在jsfiddle中复制,因为我是在ember.js上构建的,但这里有一个链接,这样你可以更好地看到js/css/html

https://jsfiddle.net/stmcxtL2/1/

尝试添加

   return false;

找到问题了。愚蠢的错误。

is-disabled类有display: none;所以它会在效果发生之前消失移除显示:none;问题解决了。