0

Делаю ползунок, изменяющий значения. Использую jQuery UI Slider. Как рядом с ползунком поместить поле для вывода значения? Например, калькулятор на http://okonka.com/

Как вывести значение, понятно. Нужно именно поле, которое будет передвигаться вместе с ползунком и выводить значение.

Проблема в том, что для вставки слайдера я вставляю див, а внутренности дива скрипт сам дописывает.

1 ответ 1

-1

JQuery UI Slider # Change Event

UPD

Даже лучше JQuery UI Slider # Slide Event

Вся функциональность плагина есть на сайте, как документация, так и всевозможные живые примеры. И я не вижу там из коробки того, что бы Вам было нужно. К тому же я не понимаю, в чем такая сложность написать пару строк кода?

[css]
.view{
    position:relative;
}

[HTML]
<div class="default">
    <div class="view"></div>
    <div class="slider"></div>
</div>

[Java Script]
$( ".slider" ).slider({
    value: 50,
    slide: function( event, ui ){
        var val = ui.value,
            sliderWidth = $( ".slider" ).width();
        $(".view").html(val).css("left",(sliderWidth*val)/100+"px");

    }
});
4
  • И куда выводится значение? Проблема не в том, как вывести, а в том, как добавить див в ползунок, в котором будет выводиться. Чтобы див ездил за ползунком, как на примере.
    – Frontender
    2 фев 2015 в 14:06
  • Свойства position:relative по отношению к этому div ползунка + значение top и left математически высчитать, как вариант.
    – Alex Krass
    2 фев 2015 в 14:23
  • Наверное, есть какое-то более стандартное решение, исходя из функционала плагина.
    – Frontender
    2 фев 2015 в 14:33
  • @Виктор Павлов, вот Вам еще примеры со stackoverflow, если надо.
    – Alex Krass
    2 фев 2015 в 15:09

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.