jQuery响应式导航效果
  • 分享到微信朋友圈
    X
立即下载 查看演示

本文介绍如何使用jQuery+html+css制作响应式导航效果

关键js代码与说明

<script>
    $(document).ready(function () {
        //打开菜单
        $(document).on("click", ".nav", function () {
            $("body").toggleClass('cur')
        });

        var htop = $(".header");

        $(window).bind("scroll", function () {
            //往下滚的高度
            var stop = $(document).scrollTop();
            //banner距上面的高度
            var btop = $(".banner").offset().top;

            if (stop > btop) {
                htop.addClass("hcur");
            }
            else {
                htop.removeClass("hcur");
            }
        });
    });  
</script>