Я нашел особенно полезный усилитель для виджета слайдера jquery ui: jQuery-ui-Slider-Pips, который почти полностью соответствует моим потребностям, за исключением одного:
Я пытаюсь реализовать пример $awesome2 из демо-страницы, упомянутой выше, но мне нужен больший диапазон: {min:-100,max:100}
и вот что у меня получилось.
Вопрос в том, как изменить частоту появления меток вместе с увеличением диапазона?
Спасибо!
Ваш вопрос кажется немного расплывчатым, но я предполагаю, что вы хотите что-то подобное? http://jsfiddle.net/3qva9yfo/1/
Все настройки внешнего вида ползунков должны выполняться с помощью CSS, поэтому в основном просто измените CSS:
#awesome2 .ui-slider-pip:nth-of-type(5n+1) > .ui-slider-line {
height: 6px;
background: #777;
}
#awesome2 .ui-slider-pip:nth-of-type(5n+1) > .ui-slider-label {
display: block;
top: 8px;
color: #ccc;
font-size: 0.8em;
}
#awesome2 .ui-slider-pip:nth-of-type(10n+1) > .ui-slider-line {
height: 10px;
background: #222;
}
#awesome2 .ui-slider-pip:nth-of-type(10n+1) > .ui-slider-label {
display: block;
top: 12px;
color: #333;
font-size: 1em;
}
to:
#awesome2 .ui-slider-pip:nth-of-type(1n+1) > .ui-slider-line {
height: 6px;
background: #777;
}
#awesome2 .ui-slider-pip:nth-of-type(1n+1) > .ui-slider-label {
display: block;
top: 8px;
color: #ccc;
font-size: 0.8em;
}
#awesome2 .ui-slider-pip:nth-of-type(5n+1) > .ui-slider-line {
height: 10px;
background: #222;
}
#awesome2 .ui-slider-pip:nth-of-type(5n+1) > .ui-slider-label {
display: block;
top: 12px;
color: #333;
font-size: 1em;
}
Помните, что в будущем нам нужно знать, чего вы хотите, чтобы помочь вам получить это :)
Si.
