帶有 CSS 和 JS 的可滾動 DIV

Question

目前，我在左側有一個帶有可滾動div標簽的塊： https://paste.pics/2b27787ffd9e5671df4d34b0b656ba2a

當鼠標懸停在附加圖像的右側（棕色背景）時，我想滾動附加圖像左側的div標簽，該怎么做？

Answer 1

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

 <div></div>

沒有js你可以滾動div的固定高度和css溢出屬性

Answer 2

檢查相對於元素的查找鼠標 position 以在右側面板上捕獲 cursor position

如果需要，使用正確的面板尺寸，您可以輕松計算 position 的百分比

從 cursor 中心 position 計算左面板的可見框並相應地更改左面板的屬性 scrollTop 和 scrollLeft