Показать сообщение отдельно
  #4 (permalink)  
Старый 04.09.2013, 12:44
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 26,500

Сообщение от Oleg_Pupkin
во время первого клика должен ползти в место клика правый ползунок, в каком бы месте этот клик не произошёл.
Вариант блокировки первого клика ...
<!doctype html>
<html>

    <head>
        <meta charset="utf-8" />
        <title>jQuery UI Slider - Range slider</title>
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css" />
        <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
        <script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
        <script>
        $(function ()
          {
            var n = 0;
            $("#slider-range").slider(
              {
              range: true,
              min: 0,
              max: 500,
              values:[70, 300],
              step: 10,
              slide: function (event, ui) {
                  if ($(ui.handle).index() == 1 && !n) {$('#slider-range').slider('values', [70,ui.values[0]]);n++;return false};
                     $("#amount").val("$" + ui.values[0] + " - $" + ui.values[1]);

                },
              change: function (event, ui) {
                  $("#amount").val("$" + ui.values[0] + " - $" + ui.values[1]);
                                }
                }
            );

            $("#amount").val("$" + $("#slider-range").slider("values", 0) +

              " - $" + $("#slider-range").slider("values", 1));

          }
        );
        </script>
    </head>

    <body>
        <p>
            <label for="amount">Price range:</label>
            <input type="text" id="amount" style="border: 0; color: #f6931f; font-weight: bold;" />
        </p>
        <div id="slider-range"></div>
    </body>

</html>
Ответить с цитированием