bootstrap sticky (fixed) Warnungen verhindert Scrollen nach unten

Question

Ich arbeite an einem einfachen Sticky-Plugin-Addon für Bootstrap. Grundsätzlich funktioniert es wie folgt aus:

if ($(this).scrollTop() < ScrollPastOffset) { 
     console.log("max it"); 
     $(fixedAlertWrappers).removeClass('scroll'); 
    } else { 
     console.log('min it'); 
     $(fixedAlertWrappers).addClass('scroll'); 
    } 

Aber wenn Sie versuchen, vorbei an den Alarm zu bewegen, verursacht es eine Panne und Sie werden nicht über den Wert, den Sie in ScrollPastOffset setzen nach unten scrollen lassen. Demo hier: https://jsfiddle.net/09kh5rp9/

Answer 1

Ihre Variable ScrollPastOffset Bedürfnisse sich ändern, wenn der Inhalt Höhe

var topDist = $("a.btn").position(); 
if (scroll > topDist.top){ 
    console.log("max it"); 
    $(fixedAlertWrappers).removeClass('scroll'); 
} 
else { 
    console.log('min it'); 
    $(fixedAlertWrappers).addClass('scroll'); 
} 

In Ihrem Fall erhöht man muss nur diese Variable bearbeiten, Rest des Codes ist das gleiche

var ScrollPastOffset = $("a.btn").position().top; 

Hier ist eine funktionierende pen

Answer 2

Einfach genug Lösung:

$(window).scroll(function() { 
    var elm = $('.fixed-alert-wrapper'); 
    if ($(this).scrollTop() < 150) { 
     if (elm.hasClass('scroll')) 
      elm.removeClass('scroll'); 
    } else { 
     if (!elm.hasClass('scroll')) 
      elm.addClass('scroll'); 
    } 
});