Несколько пользовательских дескрипторов (через уникальные имена классов) для jQuery Slider - PullRequest
Новая
       24

Несколько пользовательских дескрипторов (через уникальные имена классов) для jQuery Slider

1 голос
/ 17 мая 2011

Это вроде как спрашивали раньше, но я не нашел прямого ответа. 

$(".milestone-timeline .slider-area").slider({
  range: 'min',
  value: 298,
  min: 0,
  max: 884,
  values: [ 10, 280, 620, 850 ]    
});
$(".milestone-timeline .slider-area").slider("option", "disabled", true);

Хорошо, здесь я создал 4 разных маркера или .ui-slider-handle.Теперь, когда слайдер создан, он будет иметь, 

<div class="slider-area">
  <div class="ui-slider-range"></div>
  <a href="#" class="ui-slider-handle"></a>
  <a href="#" class="ui-slider-handle"></a>
  <a href="#" class="ui-slider-handle"></a>
  <a href="#" class="ui-slider-handle"></a>
</div>

Я хотел бы применить другое имя класса к каждому из этих дескрипторов во время создания слайдера.

In Документация слайдера пользовательского интерфейса jQuery гласит:

"При инициализации виджет слайдера создаст элементы дескриптора с классом 'ui-slider-handle'. Вы можете указатьэлементы пользовательских дескрипторов, создавая и добавляя элементы и добавляя класс 'ui-slider-handle' перед init. Это создаст только количество дескрипторов, необходимых для соответствия длине значения / значений. Например, если вы укажете'values: [1, 5, 18]' и создайте один пользовательский дескриптор, плагин создаст два других. "

К сожалению, я не уверен, как идти о создании и добавленииcustom 'ui-slider-handle'.

Любая помощь будет принята с благодарностью. Спасибо!

Ответы [ 2 ]

1 голос
/ 18 мая 2011

Попробуйте добавить дескриптор слайдера к элементам, которые вы пытаетесь превратить в слайдеры, например: 

<div class="milestone-timeline">         
    <div class="ui-slider-handle"></div>
</div>

Это работает, потому что вы все еще добавляете этот пользовательский элемент до вызова функции инициализации слайдера.

0 голосов
/ 17 мая 2011

чтение документации выглядит так: values - это просто способ установки нескольких ручек ползунка. Похоже, вы не можете добавлять классы.

Вы можете использовать селекторы nth-child, чтобы добавить класс к каждому ползунку.

http://api.jquery.com/nth-child-selector/

http://api.jquery.com/addClass/

...