带有 jQ​​uery 工具的 jQuery UI 滑块可滚动

Question

有人见过使用jQuery UI slider element 控制jQuery Tools Scrollable 的示例（或教程最好）吗？我正在寻找构建一个时间线类型的页面，并希望有一个水平滚动，它有可能在其中有一个垂直滚动。希望通过类似 jQUery UI 中内置的滑块来控制它。

当我很确定某些东西已经存在时，我宁愿不重新发明轮子。

Answer 1

您可以轻松地将滑块的change 事件链接到可滚动元素的seekTo 函数，例如：

$( ".slider" ).slider({
     change: function(event, ui) {
           myScrollable.seekTo( $( ".slider" ).slider( "value" ) , 0 );
     }
});

而且您还想在滚动条移动后更新滑块（如果有其他移动方式）。

var myScrollable = $( ".scrollable" ). scrollable({
     onSeek:function(){
           $( ".slider" ).slider( "value" , myScrollable.getIndex() );
     }
})