Question

菜单当前已设置，因此当您打开页面时，它会显示在页面底部。当您向上滚动时，黑色菜单面板将消失在视图之外，然后从顶部再次显示徽标。

有没有办法让它反转，这样一旦你向后滚动，黑色菜单就会消失并重新出现在页面底部？

        var distance = $('#content-div').offset().top,
            $window = $(window);
            var didscroll=true;
        $window.scroll(function() {
            if(didscroll==true){
            if ( $window.scrollTop() >= distance ) {
                didscroll = false;
                //alert("r");
                // Your div has reached the top
                jQuery('.header').css({"position":"fixed","top":'-100px',"left":0});
                jQuery('a.logo').css("visibility","visible");
                 jQuery( ".header" ).slideDown( 5000, function() {
                     jQuery(this).css({"top":0});

                 });
            }
            }
        });

        });

Answer 1

到达断点时删除内联样式。喜欢这个

if ( $window.scrollTop() >= distance ) {
   $(".header").attr({style : ""});
   $("a.logo").attr({style : ""});
}

Answer 2

试试这个..

var oritop = -100;
$(window).scroll(function() { //on scroll,
    var scrollt = window.scrollY; //get the amount of scrolling
    var elm = $(".box"); //get the box we want to make sticky
    if(oritop < 0) {
        oritop= elm.offset().top; //cache the original top offset
    }
    if(scrollt >= oritop) { //if you scrolled past it,
        //make it sticky or else
    }
    else { //otherwise
        //Do what you want to
    }
});

反转固定菜单动画

2 个答案: