我试图在两个单独的面板/ div之间同步滚动。
一个元素有overflow: auto
而另一个元素有overflow: hidden
(尝试复制带有冻结列的网格)。
我可以在事件发生时使用overflow: auto
来同步滚动,但不能使用overflow: hidden
同步滚动(如果你问我,这可能是正常的。)
但是,有解决方法吗?我想同时滚动两种方式。
这里有一个小提琴,可以说明我的问题(尝试在两个面板中滚动):http://jsfiddle.net/0zzbkyqg/
此外,这件事似乎已经发生在这里:http://demos.telerik.com/kendo-ui/grid/frozen-columns但我无法理解他们是如何做到的。
答案 0 :(得分:2)
也许您应该使用滚动鼠标滚轮时触发的wheel
事件,无论视图的部分是否滚动。
Demo
$("#panel-left > table").on('wheel', function (e) {
// your logic here
}
答案 1 :(得分:0)
我认为你不需要jQuery来做到这一点。
请看这里:http://jsfiddle.net/ty0jyr4y/
我已从面板中删除了position: absolute
和overflow
属性,并添加了float: left
以使其内联(也可以使用display: inline-block
),并添加了{{1 }},height: 400px
和width: 417px
到容器。
容器的宽度设置为overflow: auto
而不是417px
,因为滚动条占用了17个像素的空间(根据here在所有浏览器中)。
工作得很漂亮。这是你想要的吗?