垂直滚动的元素，保持固定水平

我已阅读了有关此主题的一些事情，并有一个“可行的”解决方案，但是，我想知道是否有一个更干净，更不紧张的方式来完成此操作。我有一个“桌子”，几个ul作为一个表格工作的元素。我有一个标题ul，它固定在垂直滚动的顶部，但在水平滚动时与身体一起滚动。我试图完成的是有一个“冻结的”左列，它始终固定在水平滚动窗口的左侧，但是会与其各自的内容行垂直滚动。正如我上面所说，我有一个使用JavaScript的工作版本，但在触摸设备上（Surface Pro，iPad mini），它使得“冻结列”紧张而不是流畅的运动。当点击并拖动水平滚动条达到所需的效果时，但我希望在所有情况下都可以这样做。垂直滚动的元素，保持固定水平

这是一个jsfiddle与一个基本的工作示例。从我所知道的情况来看，大多数设备仍然可以完美工作，而不是触摸式的。当连接到外部显示器时，可以在我的表面pro上正常工作，但只使用表面pro时，它会再次出现抖动。

欢迎任何想法或想法。

来源

2017-10-05 Craig Howell

您可能总是有两个列表，其中一个将在左侧固定（绝对定位），另一个实际上是一个带边缘的可滚动容器，与左侧面板宽度相等，占据其余空间并位于其中您的可滚动内容将放在一边。

Check this fiddle。

.left { 
    position: absolute; width: 100px; 
} 

.right { /* scrollable */ 
    width: 300px; overflow: scroll; 
}

（集装箱CSS受制于优化，当然，我只是想表明“一般”的想法）

希望它可以帮助...

来源

2017-10-05 14:11:22

感谢您的答复，但这不会垂直正确滚动。在左侧滚动时，它们是单独的容器，右侧会保持不动，当右侧滚动时左侧会保持不动。你可以通过jquery“链接”滚动操作，但是我会左右抖动来确定上下抖动。 –

啊。对不起，我错过了垂直滚动的要求。当然，它应该手动处理。我很早以前就添加了同步滚动功能，只是忘记了这一点;无论如何，对于巨大的列表它进入延迟加载行的方向（是我的情况）。对不起，首先让你感到困惑。 –

垂直滚动的元素，保持固定水平

回答

相关问题