Question

所以，我无法让我的index.php和index.css一起工作来禁用垂直滚动。我确实已经花了大约2.5个小时，这很荒谬，因为我之前在其他网站上做过。

但是，每当我运行index.php（本地）时，它都不会禁用垂直滚动。它只是隐藏滚动条。我甚至试图将index.php更改为index.html以查看是否是问题，不是，该文件没有PHP代码，但它是唯一的准备工作，因为我将在以后动态创建它。另一个奇怪的是它在JS小提琴中完美无缺。我想这只会让你们更难以帮助。这是小提琴。 http://jsfiddle.net/V346B/

编辑：问题是，为什么它在js小提琴而不是在我的浏览器（Chrome）中工作。此外，我测试它的方式是通过向Wrapper添加高度，如下所示。

Edit2：添加身高：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 个答案:

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

2 个答案:

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