Радио Регулятор Slider (jQuery) - PullRequest
0 голосов
/ 28 марта 2012

Так что это то, что я действительно хотел бы сделать, Я создаю веб-приложение, которое позволяет настраивать станции, поворачивая ручку. Однако я не уверен, как это сделать, я знаю onClick и этот тип функций, но как мне переместить изображение с 90 до 180 градусов, не создавая более одного изображения, и сохраняйте его местоположение в зависимости от того, когда они отпустили.

Например: скажем, у нас есть От 88,0 до 108,9

Я бы хотел, чтобы каждый ход увеличивался на 1, поэтому 88.0 становится 88.1 и т. д.

Спасибо

Ответы [ 3 ]

0 голосов
/ 28 марта 2012

Если вы ищете способ поворота изображения, вам обязательно нужно взглянуть туда: Преобразовать в jQuery .

Есть плагин jQuery, который называется jQuery rotate: http://code.google.com/p/jqueryrotate/

0 голосов
/ 28 марта 2012
0 голосов
/ 28 марта 2012

Hiya Рабочая демоверсия : с одним тиком здесь: http://jsfiddle.net/WwkB8/4/ (Вы увидите разницу :) - (с 2 тиками) http://jsfiddle.net/WwkB8/2/

Это поможет: если у вас есть какой-либо код, переместите его в другое место, посмотрите код ниже и работающую демонстрационную ссылку выше.надеюсь, что это полезно.идет от 88,0 до 108,9!(идет от 1 до 88,0 - 88,1)

Код запроса

$(document).ready(function() {
    $("#slider").slider({
        min: 88.0,
        max: 109.0,
        step: .1,
        values: [88.0], // In case of 2 tick slider values: [88.0, another value] 
        slide: function(event, ui) {
            for (var i = 0; i < ui.values.length; ++i) {
                $("input.sliderValue[data-index=" + i + "]").val(ui.values[i]);
            }
        }
    });

    $("input.sliderValue").change(function() {
        var $this = $(this);
        $("#slider").slider("values", $this.data("index"), $this.val());
    });
});​

HTML

<form>
    <div>
        <input type="text" class="sliderValue" data-index="0" value="88.0" />
        <input type="text" class="sliderValue" data-index="1" value="108.9" />
    </div>
    <br />
    <div id="slider"></div>
</form>

​

Ура!

...