向上滚动时如何从透明导航栏平滑过渡到不透明导航栏?

时间:2019-04-12 03:29:46

标签: javascript jquery css twitter-bootstrap jquery-mobile

当我从顶部向下滚动时,从透明到不透明的过渡非常平滑。但是,当我向上滚动时,它是一个瞬时过渡。我借用了一些代码,并一直出于我的目的而使用它,但是似乎无法使其正常工作。我相信这与 .hideme 类没有针对性有关,因为注释掉代码后我看不出任何区别。任何帮助都会很棒。谢谢。

(function ($) {
        $(document).ready(function () {
            var scroll = $(window).scrollTop();
            scroll = scroll + $(window).height() - 150;
            if($(window).width() > 1175) {
                $(function () {
                    $(window).scroll(function () {
                        if ($(this).scrollTop() > 50) {
                            $('.navbar').addClass('solid');
                        } else {
                            $('.navbar').removeClass('solid');
                        }
                        $('.hideme').each(function (i) {
                            var bottom_of_object = $(this).offset().top + $(this).outerHeight();
                            var bottom_of_window = $(window).scrollTop() + $(window).height();
                            if (bottom_of_window > bottom_of_object - 75) {
                                $(this).animate({ 'opacity': '1' }, 400);
                            }
                        }); 
                    });
                }); 
            }
            else {
                $('.navbar').addClass('solid');
            }   
        });
    }(jQuery));

0 个答案:

没有答案