title: how to make a 'div' element drag on iphone
body: <p>this is my code,for some reason , i can't use any javascript lib ,like ;jquery:</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml" style="height: 100%;"&gt;
      &lt;head&gt; 
          &lt;meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&gt; 
          &lt;meta name="viewport" content="width=device-width,minimum-scale=0.3,maximum-scale=5.0,user-scalable=yes"&gt;
          &lt;meta name="apple-mobile-web-app-capable" content="yes" /&gt; 
      &lt;/head&gt;
  &lt;body style="height: 100%;margin:0;"&gt;
  
  &lt;style type="text/css"&gt;
  #draggable { width: 100px; height: 100px; padding: 0.5em; float: left; margin: 10px 10px 10px 0; 
      border:1px solid #DDDDDD;
      color:#333333;
      background:#F2F2F2;
      cursor:move;
      }
  #droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; 
      border:1px solid #E78F08;
      color:#FFFFFF;
      font-weight:bold;
      background:#F6A828;
      overflow:hidden;
      }
  #droppable.highlight{
  
      }
  #draggable.end{
      left:0px !important;
      top:0px !important;
      }
  &lt;/style&gt;
  
  
  
  &lt;div class="demo" style="margin:0 auto;height: 100%;"&gt;
      &lt;div id="A" style="float:left;height:50%;margin:0 100px 0 0;width:100%;background:#333;"&gt;
          &lt;div id="draggable"&gt;
              &lt;p&gt;Drag me to my target&lt;/p&gt;
          &lt;/div&gt;
      &lt;/div&gt;
      &lt;div id="droppable" &gt;
          &lt;p&gt;Drop here&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;&lt;!-- End demo --&gt;
  
  &lt;script type="text/javascript"&gt;
  var $=function(id) {
       return document.getElementById(id);
   }
  
  $('draggable').ontouchstart = function(evt){
    console.log(evt.pageX + "/" + evt.pageY);
  }
  
  $('draggable').ontouchmove = function(e){
    if(e.touches.length == 1){ // Only deal with one finger
      var touch = e.touches[0]; // Get the information for finger #1
      var node = touch.target; // Find the node the drag started from
      node.style.position = "absolute";
      node.style.left = touch.pageX -node.offsetWidth /2+ "px";
      node.style.top = touch.pageX -node.offsetHeight/2+ "px";
    }
  }
  &lt;/script&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>my code Can not generate the right track，</p>
  
  <p>so what can i do .</p>
  
  <p>thanks</p>