我正在尝试创建一个页面,其中整个页面在垂直方向上很长(超过 3000 像素),并且某些页面可以滚动到超出原始页面宽度的右侧。我现在一直在寻找答案,但我似乎无法让它正常工作。
基本上,页面设置为仅查看宽度为 1024 像素的视图。在页面的大约一半处,我希望它滚动所有 4000 像素的宽度并设置 768 像素的高度。一旦用户通过该部分,宽度就会恢复到原来的 1024 像素。简而言之,我就像一个 T 形路口。
我只能使用 HTML、CSS、javascript 和 jQuery。
我正在尝试创建一个页面,其中整个页面在垂直方向上很长(超过 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/