0

我有一个问题，但我实际上不知道如何问。

当顺利通过一个点时，我试图让导航栏粘在顶部。

我的参考是这个-> http://blog.yjl.im/2010/01/stick-div-at-top-after-scrolling.html

我的问题是当我使用IE 或 Chrome 浏览器时，有一个“闪烁”的效果。

它更像是滚动功能将在滚动到该点后完成过程。所以 Nav 之后的东西（HTML）会在 0.1 ~ 0.3 秒后出现在 Nav 的顶部，然后滚动功能将完成过程。即使通过很短，但当 HTML 在导航上时它是可视化的。

但是，如果我用火狐浏览一下，就没有这样的闪烁效果.....

请问我这里有什么问题吗？？我应该检查什么？

我的设置是 Nav 之前的 Anchor，Nav z-index = 99，滚动功能内部如下。

            $(this).scrollTop() > $(anchor).offset().top
            ? nav.addClass('sticky')
            : nav.removeClass('sticky')
4

1 回答 1

0 
jQuery(document).ready(function($) {

    var my_nav = $('.navbar-sticky'); 
    // grab the initial top offset of the navigation 
    var sticky_navigation_offset_top = my_nav.offset().top;

    // our function that decides weather the navigation bar should have "fixed" css position or not.
    var sticky_navigation = function(){
        var scroll_top = $(window).scrollTop(); // our current vertical position from the top

        // if we've scrolled more than the navigation, change its position to fixed to stick to top, otherwise change it back to relative
        if (scroll_top > sticky_navigation_offset_top) { 
            my_nav.addClass( 'stick' );
        } else {
            my_nav.removeClass( 'stick' );
        }   
    };

    var initio_parallax_animation = function() { 
        $('.parallax').each( function(i, obj) {
            var speed = $(this).attr('parallax-speed');
            if( speed ) {
                var background_pos = '-' + (window.pageYOffset / speed) + "px";
                $(this).css( 'background-position', 'center ' + background_pos );
            }
        });
    }

    // run our function on load
    sticky_navigation();

    // and run it again every time you scroll
    $(window).scroll(function() {
         sticky_navigation();
         initio_parallax_animation();
    });

});
于 2015-09-01T15:38:43.880 回答