HTML 中的分页滚动行为 [英] Split page scrolling behaviour in HTML

问题描述

所以我有一个分为 2 列的页面.左栏有很长的可扩展表格，询问用户可选的产品偏好.在页面的右侧有一个更短的联系方式"表格.

So I have a page that is split into 2 columns. The left column there are expandable forms that are quite long to ask the user optional product preferences. On the right side of the page there is a much shorter, 'contact details' form.

联系方式表格是强制性的，而所有左边的产品偏好表格都是可选的.行为思想是，当用户向下滚动以完成左列可选表单时，页面只会滚动左列 - 右列中显示的联系方式表单保持在开始位置.我在实现这一点时遇到了麻烦，我还没有找到解决方案，也没有找到任何具有这种拆分列行为的在线页面示例.

The contact details form is mandatory while all the left product preferences forms are optional. The behaviour idea is that as the user scrolls down to complete the left column optional forms, the page will only scroll the left column - the contact details forms displayed in the right column stay in place beginning. I'm having trouble implementing this and I haven't found a solution yet or any examples of pages with this split column behaviour online.

有什么建议/建议吗?谢谢！

Any advice / suggestions? Thanks!

推荐答案

根据您的布局涉及的程度，您可以使用 css 固定定位，以便在页面向下滚动时，您的右栏保持在同一位置.

Depending on how involved your layout is, you can use css fixed positioning so that as the page scrolls down, your right column stays in the same place.

示例.

这篇关于HTML 中的分页滚动行为的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！