Question

当您滚动通过它们时，我正在尝试隐藏两个高度为100vh的div，但到目前为止，它仅隐藏了第一个div。

我的HTML：

<div id="bluevh">My Height is 100vh</div>
<div id="vh">My Height is 100vh</div>

<h1 id="verschwinden">verschwinden</h1>

我的jQuery：

jQuery(function($) {

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

    $win.on("scroll", function () {
       $nav.toggleClass("doch", $(this).scrollTop() > winH );
       $('#bluevh').css('display', 'none');
       $('#vh').css('display', 'none');

    }).on("resize", function(){ // If the user resizes the window
       winH = $(this).height(); // you'll need the new height value
    });

});

jfiddle：http://jsfiddle.net/4zw0cjsu/141/

Answer 1

如果您希望当用户向下滚动页面时两个div消失。您可以使用以下 JQuery 函数：

HTML ：

<div class="bluevh">My Height is 100vh</div>
<div class="vh">My Height is 100vh</div>

jQuery ：

$(window).scroll(function(){ 
    $(".bluevh, .vh").css("opacity", 1 - 
        $(window).scrollTop() / 300); 
});

滚动通过时如何隐藏div / element？

1 个答案: