jquery - toggleClass 动画不起作用？或需要帮助切换动画

Question

我正在使用以下代码：

 $('#products h2').click(
        function() {
           $('.well').toggleClass('margin-left260', 100000);
            return false;
        }
    );

我想要做的是使用左边距将 div 滑动到 260，然后让它在单击时滑回 0。我不明白为什么 .toggleClass 没有为我制作动画。

我之前使用 .animate(margin-left,'260px); 也做得很好 但是对于我的生活，我可以弄清楚如何使用切换使其返回到 0 的边距。我在这里错过了什么？

Answer 1

我在这里添加了一个 jsfiddle 示例 - http://jsfiddle.net/BaXyR/

基本上

$('.clickme').click(function(){
if($('#moveme').hasClass('marginleft260')){
      $('#moveme').animate({
        marginLeft: "-=260px",
      }, 5000, function() {
        $(this).removeClass('marginleft260');
      });    
}else{
      $('#moveme').animate({
        marginLeft: "+=260px",
      }, 5000, function() {
        $(this).addClass('marginleft260');
      });    
}
});

Answer 2

toggleClass 可用于在切换上添加/删除一个/类。margin-left260 是你的css中的一个类，即

.margin-left260 {
    margin-left:260px;
}

还查看您的代码，我认为您没有正确实现 toggleClass。见：http ://api.jquery.com/toggleClass/

您是否要为运动设置动画？

我认为正确的代码是使用 animate 函数 - 请参阅：http ://api.jquery.com/animate/