带有 CSS 和 JS 的可滚动 DIV

时间:2021-06-08 10:23:32

标签: javascript html css

目前,我在左侧有一个带有可滚动 div 标签的块:https://paste.pics/2b27787ffd9e5671df4d34b0b656ba2a

当鼠标悬停在附加图像(棕色背景)右侧时,我想滚动附加图像左侧的 div 标签, 这怎么办?

2 个答案:

答案 0 :(得分:0)

div {
    width: 300px;
    height: 200px;
    overflow-y: scroll
}
<div></div>

如果没有 js,您可以使用固定高度的 div 和 css 溢出属性进行滚动

答案 1 :(得分:0)

选中 Find mouse position relative to element 以捕捉右侧面板上的光标位置

如果需要,使用正确的面板尺寸,您可以轻松地以 % 计算位置

从光标中心位置计算左侧面板的可见框,并相应地更改左侧面板的 scrollTop 和 scrollLeft 属性

https://developer.mozilla.org/fr/docs/Web/API/Element/scrollTop