Resize and Drag Elements with JavaScript
Dragging or resizing elements or divs on the screen is a pretty popular feature of modern user interfaces. It’s pretty awesome that there is a resize property in CSS3 and drag and drop in HTML5. However, both are pretty limited, and modern designs for such functions require JavaScript solutions. Many end up implementing Resizable and Draggable from jQuery UI (example) but that library is really bloated and today I will cover some jQuery UI alternatives to resizing and dragging elements on the page.
There are other big libraries which also provide resizable and draggable functions. For example, Sencha’s ExtJS has a resizer function and YUI comes with its own Resize Utility. Resizable from RightJS is another option but these solutions will probably only make sense if you are already using these large libraries.
Another alternative is to use a smaller library that is more focused on user interaction with DOM elements. Interact.js might be a perfect fit, especially if you require mutli-touch gestures and control over inertia and snapping. If interact is still too large for you, here are few more JavaScript libraries and jQuery plugins for resizing and dragging functionality:
Drag Resize jQuery Plugin
DragResize JavaScript Library
Simple Resizable Div on jsFiddle
Resizing, Moving, and Snapping with JS and CSS
