JQuery Else if statement?

Question

Привет, я новичок в JQuery и заявлениях, и я не могу заставить мой код работать. Я уверен, что это что-то незначительное, это ошибка, но я не могу найти, что проблема именно здесь: мой код

$(window).scroll(function() { 
    if ($(this).scrollTop() >= 400) { 
     $('.BOX').animate({ 
      marginLeft: 500, 
      marginRight: 0, 
      display: 'toggle' 
     }, 5000); 
    } else if ($(this).scrollTop() < 400) { 
     $('.BOX').animate({ 
      marginLeft: 0, 
      marginRight: 0, 
      display: 'toggle' 
     }, 5000); 
    } 
}); 

Заранее спасибо, если вы можете указать мне в правильном направлении.

http://jsfiddle.net/b6KuE/86/ - Scrolltop> 400 игровых анимаций, которые я пытаюсь сделать, - это обратная анимация, когда осталось меньше 400 до 0.

Answer 1

Что именно такое $(this)?

Попробуйте вместо этого:

$(window).scroll(function() { 
    if ($(window).scrollTop() >= 400) { 
     $('.BOX').animate({ 
      marginLeft: 500, 
      marginRight: 0, 
      display: 'toggle' 
     }, 5000); 
    } else if ($(window).scrollTop() < 400) { 
     $('.BOX').animate({ 
      marginLeft: 0, 
      marginRight: 0, 
      display: 'toggle' 
     }, 5000); 
    } 
}); 

Кроме того, у вас есть довольно отрицательный ответ на этот вопрос уже. Постарайтесь помочь нам, чтобы помочь вам. Если вы говорите, что получаете ошибку, это может помочь точно сказать, что это за ошибка. Иными словами, мы просто предпологаем.

Answer 2

Как отмечено в комментариях, обработчик событий прокрутки вызывается снова и снова, когда окно прокручивается, поэтому анимация запускается снова и снова. Эти анимации выстраиваются в очередь, поэтому к тому времени, когда вы прокрутите достаточно далеко, чтобы он оживился в другом направлении, это будет долгое время, прежде чем вы увидите, что он оживляет этот путь, и это никогда не произойдет из-за переполнения.

Вы должны остановить анимацию перед перезапуском его:

$(window).scroll(function() { 
    if ($(this).scrollTop() >= 400) { 
     $('.BOX').stop().animate({ 
      marginLeft: 500, 
      marginRight: 0, 
      display: 'toggle' 
     }, 5000); 
    } else if ($(this).scrollTop() < 400) { 
     $('.BOX').stop().animate({ 
      marginLeft: 0, 
      marginRight: 0, 
      display: 'toggle' 
     }, 5000); 
    } 
}); 

jsfiddle