jQuery UI-Schieberegler Touch & Drag / Drop-Unterstützung auf Mobilgeräten

Ich habe den jQuery UI-Schieberegler bereits gestylt und in ein Projekt implementiert. Obwohl der Schieberegler reagiert, reagiert er nicht auf Berühren und Ziehen. Stattdessen müssen Sie berühren, wohin der Schieberegler gehen soll. Ich möchte vermeiden, auf die mobile jQuery-Benutzeroberfläche zu wechseln, die das Berühren und Ziehen unterstützt, da wir die jQuery-Benutzeroberfläche (nicht mobil) bereits ausgiebig verwenden.

Die Funktionalität, die wir wollen: Hier
Was wir verwenden: Hier

Auf einem Desktop kann man keinen Unterschied feststellen. Auf einem mobilen Gerät ist es offensichtlich.

Weiß jemand, wie man diese Unterstützung zur jquery-Benutzeroberfläche hinzufügt?

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

jQuery ui hat keine Touch-Unterstützung. Sie sollten es mit jQuery-ui Touch Punch verwenden .

Fügen Sie einfach das Skript nach jQuery ui hinzu:

<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>

Sie können auch cdnjs verwenden:

<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>

Hinweis: Geben Sie diesem Repo besser einen Stern auf Github.

Sie können diese js einfach verlinken.

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

Vielen Dank.