jQuery一个滑块控制另一个 [英] jquery one slider controls another

问题描述

如何使一个jQuery UI滑块控件控制另一个?如果我滑动滑块#1，它也应该滑动滑块#2.

How do I make one jquery ui slider control another? If I slide slider #1, it should slide slider #2 also.

推荐答案

在创建滑块1时提供一个幻灯片/更改功能，该功能使用在滑块1上更改的手柄的ui.value并在slider2上设置手柄的值.根据您的滑块有多少个手柄，您需要调整以下内容:

Supply a slide/change function when you create slider one, that uses the ui.value of the handle being changed on slider one and sets the handle value on slider2. Depending on how many handles your sliders have you'll need to adjust the following:

注意，我还没有尝试过，所以您可能需要对其进行一些调整.

Note I haven't tried this so you may need to tweak it some.

<div id='example1' class='ui-slider-1' style="margin:10px;">
<div class='ui-slider-handle'></div>    
</div>

<div id='example2' class='ui-slider-1' style="margin:10px;">
<div class='ui-slider-handle'></div>    
</div>

$('#example1').slider( { slide: moveSlider2 } );
$('#example2').slider( );

function moveSlider2( e, ui ) 
{
    $('#example2').slider( 'moveTo', ui.value );
}

这篇关于jQuery一个滑块控制另一个的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！