Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 18.11.2013, 16:04
Новичок на форуме
Отправить личное сообщение для Dyonis417 Посмотреть профиль Найти все сообщения от Dyonis417
 
Регистрация: 18.11.2013
Сообщений: 7

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, 18.11.2013 в 16:59.
Ответить с цитированием
  #2 (permalink)  
Старый 18.11.2013, 17:45
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Dyonis417,
бесконечная рекурсия не все браузеры выдержат -- в slidechange можно только имитацию сделать для второго ползунка но никак не устанавливать значение иначе замкнутая цепочка
Ответить с цитированием
  #3 (permalink)  
Старый 18.11.2013, 17:53
Новичок на форуме
Отправить личное сообщение для Dyonis417 Посмотреть профиль Найти все сообщения от Dyonis417
 
Регистрация: 18.11.2013
Сообщений: 7

рони,
а если кодом, то как эта имитация выглядит?
Неужели нет решения?
Ответить с цитированием
  #4 (permalink)  
Старый 18.11.2013, 18:14
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

зависимые ползунки
Dyonis417, можно и без stop если ненужно запрашивать текущее установленное значение ползунка - и то если изменять значение непрограммно: передвигая рукоятку ползунка

<!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>
Ответить с цитированием
  #5 (permalink)  
Старый 18.11.2013, 18:17
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Dyonis417,
для понимания 32 строку нельзя вставлять ни в change ни в slide
Ответить с цитированием
  #6 (permalink)  
Старый 18.11.2013, 18:20
Новичок на форуме
Отправить личное сообщение для Dyonis417 Посмотреть профиль Найти все сообщения от Dyonis417
 
Регистрация: 18.11.2013
Сообщений: 7

рони,
Спасибо! То что надо! Понял, что был не прав.

С уважением,
Денис
Ответить с цитированием
  #7 (permalink)  
Старый 11.08.2016, 16:39
Новичок на форуме
Отправить личное сообщение для Клавер Посмотреть профиль Найти все сообщения от Клавер
 
Регистрация: 11.08.2016
Сообщений: 4

Может кто-нибудь подсказать, как сделать в такой зависимости 4, а не 2 слайдера? Буду очень благодарен.
Ответить с цитированием
  #8 (permalink)  
Старый 11.08.2016, 17:02
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Клавер,
какая проблема из 100 вычесть значение ползунка и остаток распределить по остальным ползункам?
Ответить с цитированием
  #9 (permalink)  
Старый 11.08.2016, 17:08
Новичок на форуме
Отправить личное сообщение для Клавер Посмотреть профиль Найти все сообщения от Клавер
 
Регистрация: 11.08.2016
Сообщений: 4

Проблема в реализации из-за недостатка опыта и кривых мозгов
Ответить с цитированием
  #10 (permalink)  
Старый 11.08.2016, 17:23
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Клавер,
опишите зависимость ваших ползунков
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
jQuery UI Slider Mcqueen jQuery 2 03.10.2013 00:48
jQuery UI Range slider как заблокировать левый ползунок по первому клику Oleg_Pupkin jQuery 3 04.09.2013 13:44
jQuery UI Slider изменяет ширину ползунка SkaN2412 jQuery 1 26.11.2012 13:03
При активации Disqus, не работает Nivo slider, как решить проблему? pinkfloyd Общие вопросы Javascript 0 30.05.2011 15:29
Ползунки в Jquery UI Slider deface jQuery 0 07.12.2010 15:04