jQuery-uiのスライダー-停止方法のスライダーを制御できないようにするその他の各
-
08-07-2019 - |
質問
これは参考に 質問 からやってほしい
問題は、各 slider
を制御します。その結果としてます。
んど停止することがですか?
$(function() {
$("#slider").slider({ slide: moveSlider2 });
$("#slider1").slider({ slide: moveSlider1 });
function moveSlider2( e, ui )
{
$('#slider1').slider( 'moveTo', Math.round(ui.value) );
}
function moveSlider1( e, ui )
{
$('#slider').slider( 'moveTo', Math.round(ui.value) );
}
});
解決
このようにハックが製作所
$(function () {
var slider = $("#slider");
var slider1 = $("#slider1");
var sliderHandle = $("#slider").find('.ui-slider-handle');
var slider1Handle = $("#slider1").find('.ui-slider-handle');
slider.slider({ slide: moveSlider1 });
slider1.slider({ slide: moveSlider });
function moveSlider( e, ui ) {
sliderHandle.css('left', slider1Handle.css('left'));
}
function moveSlider1( e, ui ) {
slider1Handle.css('left', sliderHandle.css('left'));
}
});
基本的には、を回避するためのフィードバックの操作は、cssではなく直接の焼成のスライドイベントです。
他のヒント
var CurrentSlider = 'slider';を保存できます。
いずれかのスライダーでマウスダウンすると、CurrentSlider値をそのスライダーに設定します
およびmoveSlider(...)メソッドで、これがCurrentSliderであるかどうかを確認します。そうでない場合は、スライドを伝播しません(フィードバックを回避します)
オプションのパラメーターを moveSlider1
および moveSlider2
関数に指定するだけで、真の値に設定すると再帰が抑制されます。
上記の回答の一種である単純なアプローチ:
var s1 = true;
var s2 = true;
$('#slider').slider({
handle: '.slider_handle',
min: -100,
max: 100,
start: function(e, ui) {
},
stop: function(e, ui) {
},
slide: function(e, ui) {
if(s1)
{
s2 = false;
$('#slider1').slider("moveTo", ui.value);
s2 = true;
}
}
});
$("#slider1").slider({
min: -100,
max: 100,
start: function(e, ui) {
},
stop: function(e, ui) {
},
slide: function(e, ui) {
if(s2)
{
s1 = false;
$('#slider').slider("moveTo", ui.value);
s1 = true;
}
}
});
});
これを試してみましたが、jquery uiの変更が原因ですべての回答が機能しない可能性があります。
バドリの解決策は、置き換えれば機能します
$('#slider').slider("moveTo", ui.value);
with
$('#slider').slider("option", "value", ui.value);
所属していません StackOverflow