在一定宽度后防止水平滚动

Question

我正在制作一个顶部有大图像的网站,该网站延伸到页面的最右侧.问题是浏览器不断添加水平滚动条以允许用户滚动到此图像的末尾,但我不希望它这样做.

有什么办法我可以告诉浏览器将图像看作有点像背景图像或者只是在940px之后停止滚动？

http://www.electric-drumkit.com/404.php

有一个页面的例子,所以你可以更好地了解我的意思.

Answer 1

这样做的方法是:

• div如果您愿意<div id="wrapper">,添加一个新的(或其他相关的HTML5标签):, 包含内部的所有内容body.

• 将这些规则body移至#wrapper:

  margin: 0 auto;
  position: relative;
  width: 960px;
  

• 添加这个新的CSS:

  body {
      min-width: 960px;
      overflow: hidden;
  }
  

• 当窗口小于960px宽时,添加此项以获得水平滚动:

  html {
      overflow: auto;
  }
  

这是一个现场演示,因此您可以快速查看我的答案是否具有所需的效果.

在Firefox,Chrome,IE8中测试过.