如何在100vh滾動後切換課程

Question

如何使此功能在滾動後添加課程100vh？
目前它在850px之後添加類。

$("document").ready(function($){ 
    var nav = $('#verschwinden'); 

    $(window).scroll(function() { 
     if ($(this).scrollTop() > 850) { 
      nav.addClass("doch"); 
     } else { 
      nav.removeClass("doch"); 
     } 
    }); 
}); 

Answer 1

jQuery中100vh是簡單$(window).height()而在純JavaScript是window.innerHeightor a bit more longer。

jsFiddle demo

jQuery(function($) { 

    var $nav = $('#verschwinden'); 
    var $win = $(window); 
    var winH = $win.height(); // Get the window height. 

    $win.on("scroll", function() { 
     if ($(this).scrollTop() > winH) { 
      $nav.addClass("doch"); 
     } else { 
      $nav.removeClass("doch"); 
     } 
    }).on("resize", function(){ // If the user resizes the window 
     winH = $(this).height(); // you'll need the new height value 
    }); 

}); 

你也可以通過簡單的使用使if部分短一點：

$nav.toggleClass("doch", $(this).scrollTop() > winH); 

demo