天天看点

JQuery实现导航栏悬浮吸顶,(最新纯干货)!!!导航栏悬浮吸顶

导航栏滚动一定距离后,悬浮吸顶

导航栏悬浮吸顶

// 1.先引入jquery
.nav {
            position: relative;
            top: 12px;
            left: 50%;
            transform: translateX(-50%);
            width: 998px;
            height: 127px;
            z-index: 999;
        }

.fixnav {
            position: fixed;
            top: 0px;
            left: 50%;
            transform: translateX(-50%);
        }
******************************************************************
 <script>
        $(function () {
            $(window).scroll(function () {
                if ($(document).scrollTop() >= 621) {
                    $(".nav").addClass("fixnav")
                    $(".module1").css("top", "181px")
                } else {
                    $(".nav").removeClass("fixnav")
                    $(".module1").css("top", "54px")
                }
            })
        })
    </script>
           

继续阅读