页面滚动，保持页面垂直，而页面的某些部分是水平的

Page scrolling, keep the page vertical while parts of the page are horizontal

本文关键字：些部 水平 垂直 滚动      更新时间：2023-09-26

我正在尝试创建一个页面，其中整个页面垂直较长(超过 3000 像素(，并且某些页面可以向右滚动到超出原始页面宽度。我一直在寻找答案，但我似乎无法让它正常工作。

基本上，页面设置为仅查看宽度为 1024 像素的视图。在页面的一半左右，我希望它滚动所有宽度为 4000 像素，并设置高度为 768 像素。一旦用户超过该部分，宽度就会恢复到原来的 1024 像素。简而言之，我就像一个T型交叉路口。

我只能使用HTML，CSS，javascript和jQuery。

溢出 CSS 属性使您可以直接在div 中嵌入滚动条。您可以通过使第二部分的内容更宽并使用此属性来创建页面。

.HTML：

<section>
    <div class="wider">
        <!--Your wider content-->
    </div>
</section>

.CSS：

section{
    overflow-x: scroll;
    overflow-y: hidden;
}
.wider{
    width: 200%;
}

这是一个演示： http://jsfiddle.net/y42Dw/

相关文章：