jQuery Mobile slider: как использовать пользовательский масштаб?

#slider #jquery-mobile

#слайдер #jquery-мобильный

Вопрос:

У меня есть jQuery Mobile slider. Допустим, диапазон от 1 до 100. Что мне нужно, так это сделать масштаб экспоненциальным. Другими словами, перемещение большого пальца на заданное количество пикселей с левой стороны будет иметь меньший эффект, чем перемещение его на такое же количество пикселей с правой стороны, в направлении 100. Моя цель здесь — упростить выбор значений, таких как 1, 2, 3, 4, 5. Различать 96 и 100 не обязательно. Итак, я хочу выделить большую часть диапазона слайдера для более низких значений.

У кого-нибудь есть идеи о том, как это может работать? Или альтернативные подходы для решения этой проблемы?

Комментарии:

1. Хм, это звучит как пользовательский слайдер, не думаю, что что-то из коробки могло бы это сделать. Насколько я понимаю, вы хотите что-то вроде этого: 1——2——3——4——5—-6—-7—-8—9—10—11—12—13—14—15-16-17-18-19 значит, интервал между значениями больше, если цифры меньше, правильно?

2. да, это именно то, что я хочу. спасибо за схему 🙂

Ответ №1:

В итоге я реализовал решение, изменив исходный код jQuery Mobile в их виджете slider в соответствии с моими потребностями.

Вот ссылка на рабочую версию, если кому-то интересно:http://media.pokerslug.com/js/jqm/eslide.js

Для масштабирования используется простое отношение x * x. Чтобы использовать его, вызовите $(element).eslider() , но убедитесь, что у целевого объекта нет атрибута «тип = диапазон».

Короткую демонстрацию можно найти здесь: http://jsfiddle.net/4XrhA