更新用于touchsxcreen拖动的可拖动UI

Question

我有一个当前通过鼠标事件jscript响应的图像滑块。我想知道是否有人知道我将如何引入jsmobile或pep或甚至touchpunch以启用移动设备上的可拖动功能。目前，对Dev工具的响应测试在响应式视图中工作，但如果我使用移动设备或其他设备，它只是突出显示图像而不是拖动它们...我真的很新的jquery所以我需要知道如何实现这样的插件。谢谢你的任何建议..这是当前的jscript鼠标事件代码...

提前感谢您提供任何解决方法..

  <script>

        var selected = null, // Object of the element to be moved
        x_pos = 0, // Stores x & y coordinates of the mouse pointer
        x_elem = 0; // Stores top, left values (edge) of the element


           function _drag_init(elem) {
            // Store the object of the element which needs to be moved
            selected = elem;
            x_elem = x_pos - selected.offsetLeft
        }

        document.all                        
        function _move_elem(e) {
            x_pos = document.all ? window.event.clientX : e.pageX;



           var windw = window.innerWidth-174 
            var windww = window.innerWidth 


            if (x_pos-x_elem > windw) {bakit();}

            if (selected !== null) {
                selected.style.left = (x_pos-x_elem) + 'px'}
            }


            function _destroy() {
                selected = null;    
            }

            document.getElementById('layout').onmousedown = function () {
                _drag_init(this);
                    return false;
                }
                document.onmousemove = _move_elem;
                document.onmouseup = _destroy;

                function bakit(){
                    selected = null;
                }
    </script>

l8r---------------------------------------->
      <script type="text/javascript">
      var el = document.getElementById('drag'); 

      el.addEventListener("touchstart", handleStart, false);
      el.addEventListener("touchend", handleEnd, false);
      el.addEventListener("touchcancel", handleCancel, false);
      el.addEventListener("touchleave", handleEnd, false);
      el.addEventListener("touchmove", handleMove, false);

      function handleStart(event) {
          // Handle the start of the touch
      }

      // ^ Do the same for the rest of the events

    </script>