网站固定导航条挤动下面的DIV解决办法

网站固定导航条挤动下面的DIV


这是固定导航栏JS

//获取要定位元素距离浏览器顶部的距离

                var navH = $(".Leigl").offset().top;

                //滚动条事件

                $(window).scroll(function(){

                //获取滚动条的滑动距离

                    var scroH = $(this).scrollTop();

                    //滚动条的滑动距离大于等于定位元素距离浏览器顶部的距离，就固定，反之就不固定

                    if(scroH>=navH){

                        $(".Leigl").css({"position":"fixed","top":0});

                    }else if(scroH<navH){

                        $(".Leigl").css({"position":"static"});

                    }

                })

这是导航栏CSS

            width: 1336px;

            background: #333;

            margin-top: 0px;

            font-size: 20px; 

            z-index:9999;

这是下面div的CSS（这里覆盖了三个div这是最底层的div的css）

            border: 2px white solid;

            width: 370px;

            height: 470px;

            position: absolute;

            top: 180px;

            left: 92px;

            opacity: 0.5;

            background-color: gray;

            border-radius: 10px;

------解决方案--------------------
从你的图片看，你的这个不是左边这块被挤下去了，而是它后面的翻页部分滚上去了而左边这块没有动，所以相对位置让你觉得是被挤下去了(可以比较左边的那个箭头的垂直位置)。可能跟你用了position: absolute;绝对定位有关。