JQuery вопрос относительно того, если заявление и перемещение позиции

Question

Я пытаюсь написать программу, в которой пользователь нажимает на изображение, а затем изображение смещается вправо на 25 пикселей. Изображение перемещается, когда я нажимаю на него, но я пытался добавить фрагмент кода, который заставляет изображение возвращаться в левую часть окна, когда оно проходит по правой стороне окна. Я пытался использовать оператор If в процедуре анимации, но, похоже, он не работает. Вот что у меня есть:

$('#image').click(function() {
$(this).animate({
   left: '+=155',
function() {
    if ($(this).left > $(document).width)  {
 $(this).left = 0
  }
   };

    });

});

---

Я использую неправильный синтаксис или моя функция неверна? Спасибо за вашу помощь.

Answer 1

Я бы сделал это ...

$('#image').click(function() {

     $(this).animate({
            left: '+=155',
            function() {
                if ($(this).offset().left > $(document).width)  {
                   $(this).css({ left: 0 });
                }


       });
});

Хотя на самом деле было бы лучше сначала добавить пиксели сдвига к исходному left и убедиться, что он не превышает ширину. В этом случае, return false и не перемещайте элемент вообще.

Возможно, вы также захотите добавить ширину #image к смещению перед его вычислением, в противном случае оно не будет вызывать превышение, пока крайний левый угол элемента не будет превышен.

Answer 2

Где ваша продолжительность?

Попробуйте,

$('#image').click(function() {
     $(this).animate(
            {
               left: '+=155'
            },
            5000,
            function() {
                if ($(this).left > $(document).width)  {
                $(this).left = 0
                }    
       );
});