web页面拖放效果的实现

本文主要分析dnd.js拖放操作的实现
1.概述：dnd.js主要提供了两个对象给我们使用，一个Drag，一个Drop。可以认为一个是用来拖动的元素，另外一个是用来放下的区域，实际上也确实是这么用的。
2.主要的使用方法：
创建一个拖动元素 new Drag…，和一个拖放区域 new Drop，然后在回调函数里面实现你想要的逻辑，重要的是回调函数。随着拖放动作的进行，这包括一系列的拖放动作，
对于被拖放的元素来说，动作有：
拖动开始、拖动结束，这个时候分别传送一个函数给这一事件（也就是所谓的回调函数），这个函数只能接受一个参数，我们假设这个参数名字是params,params中的内容几乎可以让你进行无限的操作。那么先看看params有哪些,你又可以怎样操作你的拖放过程呢？
data:Drag对象包含的数据，这个必须是数字？
el:指向页面的元素和相关的css属性等
methods:dnd提供的一些操作该元素的方法，这个有很多，比如

showStateIcon(某一个state)，state包括warn等。
在dnd.js中的定义是这样的：

  /**
   * 显示状态icon
   * url 可以是图片绝对路径 也可以是 add | error | delete
   */
  showStateIcon: function showStateIcon(url) {
   
    var _this3 = this;

    setTimeout(function () {
   
      if (_this3.isMobile) return console.warn('showStateIcon仅在pc端口可用 请参考相关说明'