HTML5的新特性----拖放功能

拖放的基本概念很简单：创建一个绝对定位的元素，使其可以用鼠标移动

<h1>拖动源对象可以触发的事件</h1>
  <img src="img/p3.png" id="p3">
  <script>
    //源对象：开始拖动
    p3.ondragstart = function(){
      console.log('drag start ...');
    }
    //源对象：拖动中
    p3.ondrag = function(e){
      console.log('drag ...');
      //e.pageX  e.pageY
    }
    //源对象：拖动结束
    p3.ondragend = function(){
      console.log('drag end ...');
    }