Question

我有一个子菜单，如果滚动150px，则会在页面顶部显示淡入淡出。如果你高于150px则fadeOut。

这很好用。现在我也想在侧面的子菜单FadeOut。喜欢：在页面结束前淡入150px的顶部和150px之间。在这个区域之外：FadeOut。

这是我的jQuery-Code：

function scrollSide($) {

if ($(window).width() >= 768) {
    /*menu scroll*/

    $(window).scroll(function () {
        var scroll = $(window).scrollTop();

        if (scroll >= 150) {

            $("#navbar-example").fadeIn("easing");
            $(".sidemenu").css("top", "92px");

        } else {
            $(".sidemenu").css("top", "170px");
            $("#navbar-example").fadeOut("easing");

        }
    });
   } 
}

我需要一个if语句来说明页面顶部和页面结尾之间的情况。非常感谢！

Answer 1

您需要在<div id="chart-div"></div> <?= Lava::render('DonutChart', 'IMDB', 'chart-div') ?>语句中添加另一个条件，检查用户是否已滚动到底部。

基于这个问题：

Check if a user has scrolled to the bottom

你可以这样做：

if

FIDDLE DEMO

Answer 2

$(window).scroll(function() {
   if($(window).scrollTop() + $(window).height() > $(document).height() - 100) {
       $(window).unbind('scroll');
       alert("near bottom!");
   }
});

注意：将$（window）.height（）更改为window.innerHeight应该完成，因为当地址栏被隐藏时，额外的60px被添加到窗口的高度但是使用$（window）.height（）不会反映这一变化，同时使用window.innerHeight。

子菜单淡入页面顶部，淡入淡出最后

2 个答案: