анимация абсолютного положения jquery

Question

У меня проблемы с куском кода

$(function(){  
 $('input.no').click(function(){  
 $(this).animate({"left" : "80px"}, 150);  
 $(this).removeClass().addClass('click');   });  

 $('input.click').click(function(){  
 $(this).animate({"right" : "0px"}, 150);  
  });  
});  

и здесь вы можете увидеть полный код http://pastebin.me/a5b13717c5d7125cd904572c041ce3e1 не работает: (

Answer 1

Без использования live или делегата:

Добавить класс к кнопке, например: ползунок

$(function() {
  $('.slider-button').bind('click', function() {
    if ($(this).hasClass('no')) {
       $(this).animate({"left" : "80px"}, 150);  
       $(this).removeClass('no').addClass('click');  
    } else {
       $(this).animate({"left" : "0px"}, 150);  
       $(this).removeClass('click').addClass('no');  
    }       
  });    
});

Answer 2

Причина, по которой второй щелчок не обрабатывается, заключается в том, что на момент привязки вашего обработчика нет элементов input.click, поэтому обработчик не связан.

Чтобы убедиться, что обработчик связанпосле того, как вы измените класс ввода, вам нужно использовать live :

$(function() {
  $('input.no').live('click', function() {
    $(this).animate({"left" : "80px"}, 150);  
    $(this).removeClass().addClass('click');  
  });

  $('input.click').live('click', function() {
    $(this).animate({"right" : "0px"}, 150);  
    $(this).removeClass().addClass('no');  
  });
});