[mFilter2] сдвиг слайдера пальцем на мобилках

заранее предупреждаю решение «в лоб» и может кто подскажет более красивое решение

для того чтобы slider слушался движения пальцем по экрану мобилки оказувается нужно что-то придумать и для этого еще 10 лет назад выпустили некий хак для jquery UI
github.com/furf/jquery-ui-touch-punch
тут почитаете кому интересно

итого чтобы заработал наш сладер нам нужно подключить на страницу еще 2 файла
собственно jqueryUI и jquery-ui-touch-punch
кастомный jqueryUI с модулями mouse и Draggable
можно скачать по ссылке

теперь все это дело подключаем
JS
<!-- это мои пути у вас все будет так как вы захотите -->
<script src="/tpl/lib/jquery-ui-1.13.2.custom/jquery-ui.min.js"></script>
<script src="/tpl/lib/jquery-ui-1.13.2.custom/jquery.ui.touch-punch.js"></script>
в CSS нужно добавить
.fl_price .mse2_number_slider .ui-slider-range.ui-widget-header{
    position: absolute;
}

.fl_price .mse2_number_slider .ui-slider-handle.ui-corner-all.ui-state-default{
    position: absolute;
}

.fl_price .mse2_number_slider {
    position: relative;
}
У меня работает)))
Stepan
04 октября 2023, 19:23
modx.pro
4
869
+4

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

Евгений Дубровин
06 ноября 2023, 18:18
0
Да, у меня тоже, спасибо!
    Александр Быковский
    07 февраля 2024, 11:29
    0
    Ползунки заработали, но отвалился автокомплит у поиска — при вводе в строку поиска не отображается список релевантных ресурсов под этим полем
      Сергей Карпович
      14 марта 2024, 14:59
      0
      Почему то такой вариант не работает у меня…
      Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
      4