jquery - 将 jQuery UI Slider 附加到 DIV 的一侧（作为 DIV 的滚动条）

Question

有没有一种简单的方法可以将 UI Slider 附加到 div 的一侧以充当其滚动条？我不在乎它在技术上是在 div 的一侧还是在技术上。我只需要 UI Slider 看起来像 div 的滚动条。

这将是一个假滚动条，因为 div 的内容将是动态的，所以我不能走 jScrollPane 路线。根据 UI 滑块中的值填充内容。

我陷入了 CSS 地狱，想知道是否有几行解决方案。

提前谢谢了！

Answer 1

你的意思是这样的吗？ http://jsfiddle.net/vooboo13/6TGXj/3/

HTML：

<div id="container">
<div id="box">
    <p>asdf</p>

</div>
<div id="vertical-slider"></div>

Javascript：

$(function() {
    $( "#vertical-slider" ).slider({
        orientation: "vertical",
        range: "min",
        min: 0,
        max: 100,
        value: 60,
        slide: function( event, ui ) {
            $( "#amount" ).val( ui.value );
        }
    });
    $( "#amount" ).val( $( "#slider-vertical" ).slider( "value" ) );
});

CSS：

#container{
  float: left;         
  border: 1px solid #000;  
}

#box{
  float: left;
  width: 200px;
  height: 200px;    
}

#vertical-slider{
  float: right;
  height: 200px;    
}