Размер динамического шага Jquery Slider UI

У меня есть ползунок со следующими свойствами:

  • горизонтальное направление
  • одна ручка
  • мин 2
  • максимум 65

Моя цель — заставить пользователя выбирать только между 7 точками (например: «2, 3, 4, 26, 39, 52, 65») и ничем более.

Как мне создать динамический размер шага или как разрешить только эти точки быть шагами ползунка?


person daykkin    schedule 01.09.2011    source источник


Ответы (2)


Я предлагаю вам взглянуть на событие slide. Документ находится здесь. Это говорит

Верните false, чтобы предотвратить скольжение, на основе ui.value.

Поэтому вам просто нужно вернуть false, когда значение не то, на которое вы нацелены.

Редактировать: Черт возьми, ссылка только что привела вас на страницу слайдера. То, о чем я говорю, находится на вкладке Events, и она называется slide.

Edit2: используйте скрипту. Основное отличие от другого решения заключается в том, что в этом скольжение не будет равномерным.

Edit3: еще одна скрипта. В этом случае, если в конце слайда будет достигнуто неправильное значение, оно вернется к предыдущему правильному значению.

person Py.    schedule 01.09.2011
comment
Спасибо, это именно то, что мне нужно! - person daykkin; 01.09.2011
comment
Добро пожаловать :) (и вы можете принять этот ответ вместо другого, если это то, что вы ищете :)) - person Py.; 01.09.2011
comment
Еще один вопрос, как я могу сделать эффект ручки плавным? - person daykkin; 01.09.2011
comment
Вы имеете в виду, что он не будет резко переходить с одного шага на другой? если это так, я отредактирую ответ другой скрипкой, как только смогу. - person Py.; 01.09.2011
comment
Да, примерно так, теперь при перемещении курсор должен уходить дальше от места назначения и только тогда рука выставляется на эту точку, это сбивает логический ползунок и может запутать пользователя. Было бы хорошо, если бы стрелка следовала за курсором сразу в момент движения к месту назначения. - person daykkin; 01.09.2011
comment
Хорошо, этот ответ лучше для вашего варианта использования. Но Py, вы могли бы дать мне балл за повторное использование jsfiddle... (Лучше не переходить к дальнейшему значению, чем предыдущее значение для неправильных точек?) - person Benoît; 01.09.2011
comment
daykkin, я не понял ваш последний комментарий (вы видели обновленную скрипку?). @Бенуа: мой плохой, я думал, что сделал это. - person Py.; 01.09.2011
comment
Последнее обновление не заставляет пользователя выбирать только между 7 точками :( пользователь может выбрать любую точку от 2 до 65. - person daykkin; 01.09.2011
comment
Также я видел странную вещь. Когда я перехожу на jsfiddle.net/KyKqq в своем Ie9, ползунки работают отлично, но если я скопирую весь кадр код в результатах от ‹html› до ‹/html›, слайдер никак не реагирует на клик мыши. что? - person daykkin; 01.09.2011
comment
Ну, он может путешествовать между всеми точками, но может останавливаться только в 7 предопределенных точках. Что вы подразумеваете под копированием всего html? Тот, который сгенерирован jQuery? - person Py.; 01.09.2011
comment
Да, теперь я вижу, как работает последнее обновление, здорово! Что касается html, да, я открываю firebug, копирую весь контент из ‹html› в ‹/html› во фрейме результатов, и это не работает в IE9, также этот код jquery не работает в моем локальном html (IE9). Другой браузер чувствую себя прекрасно! - person daykkin; 01.09.2011
comment
Я обновил до ближайшего значения: jsfiddle.net/bouillard/KyKqq/9 - person Benoît; 01.09.2011
comment
Я думаю, что это не ближайшее, а ближайшее нижестоящее значение, нет? - person Py.; 01.09.2011
comment
это здорово! и работать в IE9 без проблем. Спасибо, ребята, вы такие классные! - person daykkin; 02.09.2011

Почему бы не использовать ползунок всего с 7 точками и преобразовать значение с помощью таблицы:

см. мой пример jsfiddle http://jsfiddle.net/bouillard/Uy5sD/

person Benoît    schedule 01.09.2011
comment
Спасибо, это почти то, что я хотел, но мой слайдер выглядит так: s4.postimage.org/98s5cwrll /slider.jpg Таким образом, интервал точек является динамическим (65 точек = 65 шагов) - person daykkin; 01.09.2011
comment
Что ж, тогда я предлагаю вам взглянуть на мой ответ. - person Py.; 01.09.2011