body {overflow-y：hidden}但我仍然可以垂直滾動

Question

所以，我無法讓我的index.php和index.css一起工作來禁用垂直滾動。 我確實已經花了大約2.5個小時，這很荒謬，因為我之前在其他網站上做過。

但是，每當我運行index.php（本地）時，它都不會禁用垂直滾動。 它只是隱藏滾動條。 我甚至試圖將index.php更改為index.html以查看是否是問題，不是，該文件沒有PHP代碼，但它是唯一的准備工作，因為我將在以后動態創建它。 另一個奇怪的是它在JS小提琴中完美無缺。 我想這只會讓你們更難以幫助。 這是小提琴。 http://jsfiddle.net/V346B/

編輯：問題是，為什么它在js小提琴而不是我的瀏覽器（Chrome）。 此外，我測試它的方式是通過向Wrapper添加高度，如下所示。

編輯2：添加高度：100％到身體不解決這個問題。

HTML：

<title>Bryan the Lion</title>
</head>

<body>
    <div id ="wrapper">
        <div id = "header">
                <h1>Pax Frame</h1>
                <ul>
                    <li><a href="#">h_option</a></li>
                    <li><a href="#">h_option</a></li>
                    <li><a href="#">h_option</a></li>
                    <li><a href="#">h_option</a></li>
                </ul>
        </div>
        <div id ="wrapper_main">
            <div id = "main">
                <p>WTF</p>
                <div id = "nav">
                    <ul>
                        <li><a href="#">Option</a></li>
                        <li><a href="#">Option</a></li>
                        <li><a href="#">Option</a></li>
                        <li><a href="#">Option</a></li>
                        <li><a href="#">Option</a></li>
                        <li><a href="#">Option</a></li>
                    </ul>
                </div>
                <div id = "sidebar">

                </div>
                <div id ="footer">

                </div>

            </div>
        </div>




    </div>
</body>

</html>

CSS：

body { 
overflow-y:hidden; 
} 
@font-face {
font-family: "AlexBrush";
src: url(fonts/AlexBrush-Regular.ttf) format("truetype");
}
#wrapper_main{
background: red ;
}
#wrapper{
width: 80% ;
margin: 0 auto ;
background: yellow ;
height: 1000px ;
}
#main{
background: blue ;
background-position: right ;
background-repeat: no-repeat;
}
#header{
width: 90% ;
height: 150px ;
background: green ;
}
#header h1{
font-family: AlexBrush ;
font-size: 5em ;
}
#nav{
height: 50px ;
width: 80% ;
margin: 0 auto ;
display: block ;
background: gray ;
}   
#nav ul li{
display: inline-block;
letter-spacing: 2px ;
background: purple ;
}
#sidebar{

}

請在我沮喪之前幫助我，因為我無法弄清楚這一點。

Answer 1

嘗試給予包裝高度：100％。 您的身體高度較小，以％為單位，以像素為單位包裝。

Answer 2

#header ul{
 padding:0;
 margin:0;
 width:140px;
 position:relative;
 height:40px;
}
#header ul li{
 list-style:none;
 padding:10px;
 border:1px solid red;
 background-color:red;
 }
#header ul li a{
 text-decoration:none;
 color:white;
}
 //whter you  script
 $(#header ul).mouseover(function(){
   $(this).removeAttr("style");
 })
 $(#header ul).mouseover(function(){
   $(this).css("oveflow","auto");
 });

  // write you html

    <ul style"overflow:hidden">
        <li><a href="#">Option</a></li>
        <li><a href="#">Option</a></li>
        <li><a href="#">Option</a></li>
        <li><a href="#">Option</a></li>
        <li><a href="#">Option</a></li>
        <li><a href="#">Option</a></li>
    </ul>

body {overflow-y：hidden}但我仍然可以垂直滾動

問題描述

2 個解決方案

解決方案1
2 已采納 2014-05-20 07:43:55

解決方案2
1 2014-05-20 07:55:53

body {overflow-y：hidden}但我​​仍然可以垂直滾動

問題描述

2 個解決方案

解決方案1 2 已采納 2014-05-20 07:43:55

解決方案2 1 2014-05-20 07:55:53

body {overflow-y：hidden}但我仍然可以垂直滾動

解決方案1
2 已采納 2014-05-20 07:43:55

解決方案2
1 2014-05-20 07:55:53