Drag & drop на ipad, iphone, android

Как реализовать drug & drop эффект на устройствах с touch-интерфейсом, таких как ipad, iphone, android-os?

Все просто.

Необходимо скачать отсюда виджет для jQuery UI touch,  который делает возможным использование draggable на touch-устройствах.

Для того чтобы это сделать, необходимо проделать следующие действия:

  1. Скачать touch-punch
  2. Подключить jQuery
    1
    
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
  3. Подключить jQuery UI
    1
    
    <script type="text/javascript" src="http://code.jquery.com/ui/1.8.21/jquery-ui.min.js"></script>
  4. Подключить jQuery UI touch punch
    1
    
    <script type="text/javascript" src="jquery.ui.touch-punch.min.js"></script>
  5. Повесить draggable на необходимый элемент
    1
    
    <script>$('#widget').draggable();</script>
  6. Насладиться 🙂
Drag & drop на ipad, iphone, android

Drag & drop на ipad, iphone, android

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


  1. Александр

    Спасибо огромное! Работает, как часики)

  2. игорь

    а как быть со слайдером с ползунком для выбора диапазона?
    там куда вешать draggable?
    Пробую на div вокруг слайдера — так двигается весь слайдер
    а надо ведь только ползунки




YouTube бесплатно навести проклятие порчу