html - 我想使用 CSS 将滚动限制添加到固定页脚

Question

如何将滚动限制添加到我的页脚，我的意思是我不希望我的页脚在我的页面顶部跟随我。我想添加限制到它。这是我的 CSS:

        #footer
        {
            position:fixed;      
            display:none;
            bottom:0;
            left:0;
            width:100%;
            /*min-height: 80px;*/
            text-align:center;
            background: transparent;
       }

Answer 1

您可以使用 javascript (jQuery) 来做到这一点。在您的 css 中，您将有两个类:.footer 和 .sticky_footer。然后 - 例如，通过 jQuery 切换这两个类。

var footer = $('.footer'),
    $window = $(window);
$window.on('scroll', function(){
    if( $window.scrollTop() > 1200 ) {
        footer.addClass('sticky_footer');
    } else {
        footer.removeClass('sticky_footer');
    }
});

当然，您的条件和脚本可能会有所不同。