div 可拖拉 缩放

一：div缩放：resize

第一种方式：鼠标按键事件控制：

参考资料

1、http://www.zzzyk.com/show/1c01d23f4b3ff34a.htm

2、http://www.cnblogs.com/cjnmy36723/p/3952072.html

 第二种方式：jquery-ui插件 resizable

参考资料：

1、http://jqueryui.com/resizable/

 

 

 

二：div拖动 drag

第一种方式：鼠标按键事件控制：

参考资料

1、http://www.zzzyk.com/show/1c01d23f4b3ff34a.htm

2、http://www.cnblogs.com/cjnmy36723/p/3952072.html

 第二种方式：jquery-ui插件 draggable

参考资料：

1、http://jqueryui.com/draggable/

 

拖拽时间触发顺序：

dragstart：要被拖拽的元素开始拖拽时触发，这个事件对象是被拖拽元素。 
drag:拖拽元素时触发，这个事件对象是被拖拽元素。 
dragenter：拖拽元素进入目标元素时触发，这个事件对象是目标元素。 
dragover：拖拽某元素在目标元素上移动时触发，这个事件对象是目标元素。 
dragleave：拖拽某元素离开目标元素时触发，这个事件对象是目标元素。 
drop：将被拖拽元素放在目标元素内时触发，这个事件对象是目标元素。 
dragend：在drop之后触发，就是拖拽完毕时触发，这个事件对象是被拖拽元素。