Question

这是我的代码：

$(window).on("load scroll resize", function() 
{
    if( $( window ).width() >= 767)
    { 
        $( ".boxlogo" ).css("display","block");
        $( ".nav > li").css("margin-top","95px");`

        var s = $(window).scrollTop();
        if(s  > 1)
        {
            $( ".boxlogo" ).css("width","140px");
            $( ".navbar-color" ).css("background-color","#fff");
            $( ".dropdown-menu > li > a") .css("color","#000");
            $( ".dropdown > a ").css("color","#000");
            $( ".nav > li > a").css("color","#000");                    
            $( ".dropdown-menu > li > a") .css("text-shadow","2px 2px #fff");
            $( ".dropdown > a ").css("text-shadow","1px 1px #fff");
            $( ".nav > li > a").css("text-shadow","1px 1px #fff");
            $( ".nav > li").css("margin-top","62px");
            $( ".dropdown-menu").css("background-color","#fff");
        }
        else 
        {
            $( ".boxlogo" ).css("width","200px");
            $( ".navbar-color" ).css("background-color","transparent");                
            $( ".dropdown-menu > li > a") .css("color","#fff");
            $( ".dropdown > a ").css("color","#fff");
            $( ".nav > li > a").css("color","#fff");
            $( ".dropdown-menu > li > a") .css("text-shadow","1px 1px #000");
            $( ".dropdown > a ").css("text-shadow","1px 1px #000");
            $( ".nav > li > a").css("text-shadow","1px 1px #000");
            $( ".dropdown-menu").css("background-color","transparent");
            $( ".nav > li").css("margin-top","96px");
        }
    }//if windows
    else {
        $( ".boxlogo" ).css("display","none");
        $( ".nav > li").css("margin-top","5px");
    }
});//scroll resize*/`

问题在于：

$( ".boxlogo" ).css("display","block");
$( ".nav > li").css("margin-top","95px");

当窗口宽度为767px但是在784px时，

不起作用......为什么？这更重要因为是菜单改变风格的重点。我试着使用if（$（window）.innerWidth（）＆gt; = 767）但问题仍然存在。我也尝试用css @media做到这一点，但根本不工作。我正在使用bootstrap。

Answer 1

您可以尝试使用返回文档宽度（不使用滚动条）的属性$(window).width()，而不是使用document.documentElement.clientWidth或类似的东西。至少这对我来说在类似的情况下和我可以说的跨浏览器。

$（窗口）.WIDTH（）;不能在正确的位置工作

1 个答案: