Тема: slider slidechange
Показать сообщение отдельно
  #4 (permalink)  
Старый 18.11.2013, 18:14
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,075

зависимые ползунки
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>
Ответить с цитированием