Почему так происходит?

Question

[yankoyski]

Код, определяющий напрявление скорлла:

var tempScrollTop, currentScrollTop;
$(window).scroll(function(){
    currentScrollTop = $(window).scrollTop();
    if (tempScrollTop < currentScrollTop ){
        alert("Вниз");
    }
    else if (tempScrollTop > currentScrollTop ) {
        alert("Вверх");
    }
     tempScrollTop = currentScrollTop;
});

Почему код работает, если строку tempScrollTop = currentScrollTop; написать в конце, работает, если написать после строки $(window).scroll(function(){, но не работает, если написать после строки currentScrollTop = $(window).scrollTop();?

Только изучаю Js. поэтому попрошу объяснить как можно доступнее. Спасибо.

Answer 1

[Руслан .]

Если вы присваиваете значение tempScrollTop до сравнения с currentScrollTop то заменяете предыдущее значение в tempScrollTop на currentScrollTop и ваши последующие проверки не срабатывают, т.к. переменные теперь равны.

Answer 2

[Andrew]

Читайте про if'ы больше, чтобы не возникало таких вопросов.
Если присваивание(приравнивание) переменных вверху:
У вас они в любой момент скролла равны по-дефолту, захода в if нет.
Как я понял, вы хотите чтобы при скролле вверх, на каждом проскролле, выводилось "вверх" и вниз - "вниз"?
Вам для этого надо сохранять предыдущую позицию и с ней сравнивать(изначально она должна быть в нуле).

var tempScrollTop=0,
 currentScrollTop;
$(window).scroll(function(){
    currentScrollTop = $(window).scrollTop();
    if (tempScrollTop < currentScrollTop ){
        alert("Вниз");
    }
    else if (tempScrollTop > currentScrollTop ) {
        alert("Вверх");
    }
     tempScrollTop = currentScrollTop;
});