Question

您好我是javascript的新手，我只是在它到达特定元素/类后尝试淡入导航栏，而不是使用窗口顶部的距离。

// Navigation bar - show on scroll
$(document).ready(function(){

    // hide .navbar first
    $(".navbar").hide();

    // fade in .navbar
    $(function () {
        $(window).scroll(function () {
            // set distance user needs to scroll before we fadeIn navbar
            if ($(this).scrollTop() > 200) {
                $('.navbar').fadeIn();
            } else {
                $('.navbar').fadeOut();
            }
        });
    });

});

Answer 1

您可以使用.offset（）来获取相对于文档的元素位置。

所以（在window.scroll函数之外做类似的事情。

var offset = $('.myTriggerClass').offset().top;

然后将您的条件更改为

if ($(this).scrollTop() > offset)

所以你最终会得到

$(".navbar").hide();

// set distance user needs to scroll before we fadeIn navbar
var offset = $('.myTriggerClass').offset().top;

// fade in .navbar
$(function () {
    $(window).scroll(function () {
        if ($(this).scrollTop() > offset) {
            $('.navbar').fadeIn();
        } else {
            $('.navbar').fadeOut();
        }
    });
});

.JS滚动浏览元素后淡入导航栏

1 个答案: