Add-remove class to Fixed element

Question

Попытка добавления и удаления класса в jQuery sticky Фиксированный элемент h2.sly-scroll-title3(Заголовок 1), когда #Label1 на видовом экране. Значения добавляют класс .extraclass к h2.sly-scroll-title3 только тогда, когда #Label1 блокирует окно просмотра и удаляет класс, когда его нет в окне просмотра.

HTML:

<div id="Label1"> 

<div class="bottom-label-post1"> 

<h2 class="sly-scroll-title3" >Title 1</h2> <!-- Scroll Element --> 

<div class="clear"></div> 

<div class="list-label-widget-content"> 

Content 1 

</div> 

</div> 

</div> <!-- End --> 

Пожалуйста, смотрите эту скрипку: http://jsfiddle.net/8g20ha5y/2/

Заранее спасибо.

Answer 1

Пробное sticky-end Событие. Код будет, как показано ниже -

$('h2.sly-scroll-title3').on('sticky-start', function() { $('h2.sly-scroll-title3').removeClass('extraclass'); }); 
$('h2.sly-scroll-title3').on('sticky-end', function() { $('h2.sly-scroll-title3').addClass('extraclass'); }); 

Есть другие события, приведенные ниже, в соответствии с документацией

$('#sticker').on('sticky-start', function() { console.log("Started"); }); 
$('#sticker').on('sticky-end', function() { console.log("Ended"); }); 
$('#sticker').on('sticky-update', function() { console.log("Update"); }); 
$('#sticker').on('sticky-bottom-reached', function() { console.log("Bottom reached"); }); 
$('#sticker').on('sticky-bottom-unreached', function() { console.log("Bottom unreached"); });