Слайдер jQuery інтерфейсу користувача Підтримка Touch & Drag / Drop на мобільних пристроях

Я вже стилізував та впровадив повзунок jQuery UI у проект. Хоч він чуйний, повзунок не реагує на торкання та перетягування. Натомість вам потрібно торкнутися, куди ви хочете, щоб повзунок перейшов. Я хотів би уникати переходу на мобільний інтерфейс jQuery для мобільних пристроїв, який підтримує торкання та перетягування, оскільки ми вже широко використовуємо jQuery (немобільний) інтерфейс користувача.

Функціонал, який ми хочемо: Ось
Що ми використовуємо: Ось

На робочому столі ви не можете визначити різницю. На мобільному пристрої це видно.

Хтось знає, як додати цю підтримку до інтерфейсу jquery?

$("#videographers").slider({
  value: 2,
  min: 1,
  max: 3,
  step: 1,
  slide: function(event, ui) {
    return calcTotal(ui.value);
  }
});

jQuery ui не має сенсорної підтримки. Ви повинні використовувати його з ударним сенсором jQuery-ui .

Просто додайте сценарій після jQuery ui:

<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://code.jquery.com/ui/1.8.21/jquery-ui.min.js"></script>
<script src="jquery.ui.touch-punch.min.js"></script>

Ви також можете використовувати cdnjs:

<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js"></script>

Примітка: Краще дайте цій репо зірку на Github.

Ви можете просто пов'язати цей js.

<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jqueryui-touch-punch/0.2.3/jquery.ui.touch-punch.min.js"></script>

Дякую.