Vis JS Timeline垂直滚动页面时如何冻结顶部水平时间轴

你可以通过纯CSS的sticky定位实现顶部时间轴滚动时固定，不需要修改现有JS逻辑，操作成本最低：

实现步骤 #

新增如下CSS规则即可：

/* 固定顶部水平时间轴 */
.vis-timeline .vis-time-axis.vis-top {
    position: sticky !important;
    top: 0;
    background: #ffffff;
    z-index: 99;
}

注意事项 #

• 若时间线容器设置了overflow: hidden属性会导致sticky定位失效，可将容器的overflow属性调整为overflow-y: auto即可
• 背景色可根据你的页面主题自定义，作用是遮挡下方的时间条目，避免滚动时出现内容重叠的显示问题

如果你当前是时间线内部固定高度滚动的场景（也就是代码里#visualization设置了固定height的情况），上述方案同样生效，不需要额外调整。

内容的提问来源于stack exchange，提问作者synaptik