.scroll() работает только один раз

Question

Я пытаюсь создать небольшой фрагмент для липкой боковой панели с jQuery. По какой-то причине функция внутри .scroll() работает только один раз вместо запуска в каждом событии прокрутки. Что я могу делать неправильно?

var sticky = $('#sticky'); 
var staticSticky = $(sticky).offset().top; 

$(window).scroll(moveEl(sticky, staticSticky)); 

function moveEl(element, staticElToTop){ 
    if($(window).scrollTop() >= staticElToTop){ 
     $(element).css('top', $(window).scrollTop() + 'px'); 
    } 
} 

Смотрите здесь для всей попытки: http://codepen.io/ExcellentSP/pen/GqZwVG

Код выше не является полностью функциональным. Я просто пытаюсь заставить событие прокрутки работать должным образом, прежде чем продолжить.

Answer 1

Вам нужно обернуть содержание вашего вашего moveEl метода в функцию (должен быть возвращен для $(window).scroll()), как это:

var sticky = $('#sticky'); 
var staticSticky = $(sticky).offset().top; 

$(window).scroll(moveEl(sticky, staticSticky)); 

function moveEl(element, staticElToTop) { 
    return function() { 
    if($(window).scrollTop() >= staticElToTop){ 
     $(element).css('top', $(window).scrollTop() + 'px'); 
    } 
    } 
} 

Объяснение: Основное различие заключается в том, что вы вызываете функцию и ее возвращает undefined по умолчанию, поэтому он равен $(window).scroll(undefined). Поскольку вы на самом деле называете это, вы видите, что его увольняют только один раз, что очевидно.

Как только вы возвращаете функцию в пределах moveEl метода, .scroll() получает обработчик, поэтому он становится $(window).scroll(handler). Таким образом, он будет работать сейчас, как ожидалось.

Answer 2

При этом $ (window) .scroll (moveEl (sticky, staticSticky)) ;, вы запрашиваете javascript для выполнения функции. Вы не передадите его ссылку.

$(window).scroll(function(){ 
    moveEl(sticky, staticSticky); 
});