draggable 属性

2019独角兽企业重金招聘Python工程师标准>>>

项目需求是做一个spliter,拖动后调整左右两边的布局大小！

昨天是在document上绑定mousedown ,mousemove ,mouseup事件，来实时计算，并设置相应元素的宽度，这是最直接想到的办法，就不再多说了！

今天又看到一个html5属性：draggable，就多了解一下了。

浏览器中，每个元素都可以拖动，默认是draggable="auto".此时它们的行为是浏览器赋予的，默认情况是：只有   选中文本，图片，超链接  是可以被拖动，并且拖动后，会把它的“值/链接地址”赋予拖动的事件中去。

如要普通元素可以拖动 ，只需要增加 draggable="true" 的属性。经测试在IE,CHROME中，它是正常的，拖动时，会有一个浅的影子跟随！

<div id="app" draggable="true"> 你可以试试拖动我！ </div>

但firefox浏览器下，却没反应！去MDN上查一下说明，才知道，标准规定，须满足以下情况才行：

1、增加draggable属性

2、添加dragstart事件并设置drag data的值  

<div draggable="true" ondragstart="event.dataTransfer.setData('text/plain', 'This text may be dragged')">
  This text <strong>may</strong> be dragged.
</div>

此时：firefox浏览器下可以拖动，但没有浅的影子，

转载于:https://my.oschina.net/u/1540190/blog/961928