Сделать элемент палкой сверху при прокрутке

Question

Я написал функцию, чтобы сделать элемент элемента div сверху при прокрутке.

это работает, когда это написано, как это («# липкий якорь-для-социального» является обнаружение расстояния перемещения элемента, «# социально-медиа» является элемент палочки):

function sticky_socialmedia() { 
    var window_top = $(window).scrollTop(); 
    var social_top = $('#sticky-anchor-for-social').offset().top - 88; 
    if (window_top >= social_top) { 
     $('#social-media').addClass('stick-social'); 
    } else { 
     $('#social-media').removeClass('stick-social'); 
    } 
} 

$(window).scroll(sticky_socialmedia); 
sticky_socialmedia(); 

но он не работает, когда я пишу это следующим образом:

function stickyWhenScroll(anchor, sticky) { 
    var window_top = $(window).scrollTop(); 
    var filter_top = $(anchor).offset().top - 88; 
    if (window_top >= filter_top) { 
     $(sticky).addClass('stick-filter'); 
    } else { 
     $(sticky).removeClass('stick-filter'); 
    } 
} 

$(window).scroll(stickyWhenScroll); 
stickyWhenScroll('#sticky-anchor-for-social','#social-media'); 

что может пойти не так? большое спасибо!

Answer 1

Вам нужно отправить параметры вашей функции при добавлении события, вы можете сделать это с bind:

$(window).bind('scroll', { 
    anchor: '#sticky-anchor-for-social', 
    sticky: '#social-media' 
}, stickyWhenScroll).trigger('scroll'); 

При пропускании trigger('scroll') вы можете вызвать функцию сразу.

И в функции вы можете получить их по экранным на event.data:

function stickyWhenScroll(event) { 
    var data = event.data; 
    var anchor = data.anchor; 
    var sticky = data.sticky; 
    ... 
} 

Fiddle

Answer 2

Потому что в вашей 2-й фрагмент кода обработчика события прокрутки не получил никаких Params. Вы можете либо пропустить параметры оба раза (загрузка и прокрутка), либо объявить их глобальными переменными и использовать их в функции.

(function stickyWhenScroll(anchor, sticky) { 
    var window_top = $(window).scrollTop(); 
    var filter_top = $(anchor).offset().top - 88; 
    if (window_top >= filter_top) { 
     $(sticky).addClass('stick-filter'); 
    } else { 
     $(sticky).removeClass('stick-filter'); 
    } 
}('#sticky-anchor-for-social', '#social-media')); 

$(window).scroll(function() { 
    stickyWhenScroll('#sticky-anchor-for-social','#social-media'); 
});