问题 如何在100vh滚动后切换类


如何使此功能在滚动后添加类 100vh
目前它增加了课程 850px

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

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

1308
2017-11-04 07:28


起源

不应该 $(document) ?甚至更短: jQuery(function($){ - Roko C. Buljan
我不知道,这就是我在互联网上找到的,它的工作原理。 - Kevin Brandao da Graca


答案:


100vh 在jQuery中很简单 $(window).height() 而在纯JavaScript中是 window.innerHeight  或者更多

jsFiddle演示

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 );

演示


16
2017-11-04 07:36



很好,它的作品!但是我忘记了Naviagtion也花了6vh,是否有某种方法可以从窗户高度移除导航的高度? - Kevin Brandao da Graca
6视口高度为6%sry - Kevin Brandao da Graca