Анимация toggleClass не работает? или нужна помощь для переключения анимации

Я работаю с этим кодом:

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

То, что я хочу сделать, - это сдвинуть div на 260 с использованием левого поля, а затем снова сдвинуть его при щелчке до 0. Я не понимаю, почему.toggleClass не анимирует меня.

Я также хорошо делал раньше, используя.animate(margin-left,'260px); но за всю жизнь я мог бы понять, как использовать тумблер, чтобы вернуть его с полем 0. Чего мне здесь не хватает?

2 ответа

Решение

Я добавил пример 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');
      });    
}
});

toggleClass может использоваться для добавления / удаления класса / классов в переключателе. margin-left260 это класс в вашем css, т.е.

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

Кроме того, глядя на ваш код, я думаю, что вы не правильно реализуете toggleClass. см.: http://api.jquery.com/toggleClass/

Вы пытаетесь оживить движение?

Я думаю, что правильный код будет использовать функцию animate - см.: http://api.jquery.com/animate/

Другие вопросы по тегам