2016-05-26 17 views
0

Mein Code prüft, ob der Bildlauf >= bis 100 ist. Wenn das stimmt, zeigt es mein sticky nav. Wenn nicht, sollte das sticky nav verstecken. Im Moment funktioniert der wahre Teil. Aber wenn ich das falsche Argument hinzufüge, wenn ich scrolle, verschwindet das gesamte sticky nav im Allgemeinen.Warum funktioniert meine Scroll nicht?

-Code

$(function(){ 
    var hasBeenTrigged = false; 
    $(window).scroll(function() { 
     if ($(this).scrollTop() >= 100 && !hasBeenTrigged) { // if scroll is greater/equal then 100 and hasBeenTrigged is set to false. 
      $("#sticky_nav").show(); 
      hasBeenTrigged = true; 
     } else { 
      $("#sticky_nav").hide(); 
     } 



    }); 
}); 
+0

Sie müssen die Implementierung von 'hasBeenTrigged' abschließen. Im Moment wird beim ersten Häkchen das Nav angezeigt, dann schlägt der zweite Tick '! HasBeenTrigged' fehl und bewirkt, dass er verschwindet. –

+0

Wenn Sie 100px nach unten scrollen, wird sticky_nav angezeigt, aber wenn Sie rückwärts und zurück scrollen, wird 'hasBeenTrigged' immer noch auf 'true' gesetzt, so dass es nicht wieder angezeigt wird. Setzen Sie 'hasBeenTrigged' auf "false", wenn Sie es ausblenden. –

+0

Warum verwenden Sie (var hasBeenTrigged) –

Antwort

1

Überprüfen Sie die Variable hasBeenTrigged im wahren Teil $(this).scrollTop() >= 100 Aussage

$(function(){ 
    var hasBeenTrigged = false; 
    $(window).scroll(function() { 
     if ($(this).scrollTop() >= 100) { // if scroll is greater/equal then 100 and hasBeenTrigged is set to false. 
      if(!hasBeenTrigged){ 
       $("#sticky_nav").show(); 
       hasBeenTrigged = true; 
      } 
     } else { 
      // this only if you want to show again, on the next scroll down 
      hasBeenTrigged = false; 
      $("#sticky_nav").hide(); 
     } 



    }); 
}); 
0

Sie sollten scrollTop nur überprüfen, so dass Sie hasBeenTrigged aus dem if Bedingung

entfernen sollten
$(function(){ 
    var hasBeenTrigged = false; 
    $(window).scroll(function() { 
     if ($(this).scrollTop() >= 100) { // if scroll is greater/equal then 100 and hasBeenTrigged is set to false. 
      $("#sticky_nav").show(); 
      hasBeenTrigged = true; 
     } else { 
      $("#sticky_nav").hide(); 
     } 



    }); 
}) 

https://jsfiddle.net/69Lxw8zt/

Verwandte Themen