项目需求是做一个spliter,拖动后调整左右两边的布局大小!
昨天是在document上绑定mousedown ,mousemove ,mouseup事件,来实时计算,并设置相应元素的宽度,这是最直接想到的办法,就不再多说了!
今天又看到一个html5属性:draggable,就多了解一下了。
浏览器中,每个元素都可以拖动,默认是draggable="auto".此时它们的行为是浏览器赋予的,默认情况是:只有 选中文本,图片,超链接 是可以被拖动,并且拖动后,会把它的“值/链接地址”赋予拖动的事件中去。
如要普通元素可以拖动 ,只需要增加 draggable="true" 的属性。经测试在IE,CHROME中,它是正常的,拖动时,会有一个浅的影子跟随!
你可以试试拖动我!
但firefox浏览器下,却没反应!去MDN上查一下说明,才知道,标准规定,须满足以下情况才行:
1、增加draggable属性
2、添加dragstart事件并设置drag data的值
This text may be dragged.
此时:firefox浏览器下可以拖动,但没有浅的影子,