slider slidechange
Добрый день!
Помогите, пожалуйста, разобраться. Есть два слайдера: slider1, slider2. Для каждого слайдера определено окно, в котором пишется числовое значение бегунка: text1, text2. Бегунки должны быть взаимозависимыми: сумма числовых значений этих бегунков должна быть равна 100. Цель: пользователь перемещает бегунок, другой перемещается автоматически, при этом обновляются text1, text2. Где ошибка?
$("#slider1,#slider2").bind('slidechange', function(event,info) {
$("#slider1,#slider2").not($(this)).slider('value',100 - $(this).slider('value'));
$("#text1").attr('value',$("#slider1").slider('value'));
$("#text2").attr('value',$("#slider2").slider('value'));
$("#text1").trigger();
$("#text2").trigger();
});
Спасибо! С уважением, Денис |
Dyonis417,
бесконечная рекурсия не все браузеры выдержат -- в slidechange можно только имитацию сделать для второго ползунка но никак не устанавливать значение иначе замкнутая цепочка |
рони,
а если кодом, то как эта имитация выглядит? Неужели нет решения? |
зависимые ползунки
Dyonis417, можно и без stop если ненужно запрашивать текущее установленное значение ползунка - и то если изменять значение непрограммно: передвигая рукоятку ползунка
:cray:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>slider demo</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/south-street/jquery-ui.css">
<style>
#slider0, #slider1 { margin: 10px; width: 300px; }
</style>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
</head>
<body>
<input id="text0">
<div id="slider0"></div>
<input id="text1">
<div id="slider1"></div>
<script>
var sliders = $( "#slider0, #slider1" );
sliders.slider(
{
stop: function(event, ui) {
var i = sliders.index(this);
$("#text"+i).val(ui.value);
i ^= 1;
$("#slider"+i).slider("value", 100-ui.value);
},
change: function( event, ui ) {
var i = sliders.index(this);
$("#text"+i).val(ui.value);
i ^= 1;
$("#slider"+i+ " .ui-slider-handle").css("left", (100-ui.value)+"%");
$("#text"+i).val(100 - ui.value);
},
slide: function( event, ui ) {
var i = sliders.index(this);
$("#text"+i).val(ui.value);
i ^= 1;
$("#slider"+i+ " .ui-slider-handle").css("left", (100-ui.value)+"%");
$("#text"+i).val(100 - ui.value);
}
}
);
$( "#slider0" ).slider("value", 50)
</script>
</body>
</html>
|
Dyonis417,
для понимания 32 строку нельзя вставлять ни в change ни в slide |
рони,
Спасибо! То что надо! Понял, что был не прав. С уважением, Денис |
Может кто-нибудь подсказать, как сделать в такой зависимости 4, а не 2 слайдера? Буду очень благодарен.
|
Клавер,
какая проблема из 100 вычесть значение ползунка и остаток распределить по остальным ползункам? |
Проблема в реализации из-за недостатка опыта и кривых мозгов:D
|
Клавер,
опишите зависимость ваших ползунков |
| Часовой пояс GMT +3, время: 16:02. |