HTML5 Upload Image: Drag and Drop Plugin
HTML5 Upload Image, Ratio with Drag and Drop is a tool to help you upload images, making full use of HTML5 with canvas. The drag and drop feature makes this an ideal, and easy, solution for use in a content management system.
Key features include:
- Use canvas to crop images (no server scripts needed)
- Full HTML5 support
- Touch support so everything works great on tablet and mobile devices
- Responsive design
- Save images with AJAX or use the traditional FORM input file element
- Uses ratios to fit screens or elements
- Easy to use
- Additional options to configure
- Works with Bootstrap 3.1
- Works with jQuery 1.9
HTML5 Upload Image is a premium tool and is available from the Envato Market for $11, which includes quality checks, future updates and 6 months of support.
Drag and Drop Sortable Lists
Drag and Drop is a full website and content management system back end with an included database. This plugin works with that system to create three options for using and displaying sortable lists with jQuery, CSS, mySQL, AJAX and PHP.
The first example populates the list from the database, allows you to sort the order, then allows you to save he list using ajax functionality so the page does not reload. In addition, there is a message box that shows the status of whether the boxes have been moved and not saved and whether changes have been implemented to the database.
The second example is a simple sort list that allows you to produce a list of varying length and apply a drag and drop feature.
The third example shows how the functionality can work across a multiple column format.
This tool works across a variety of platforms and includes support for touch devices and lets you save lists via a cookie session. Drag and Drop Sortable Lists is available from the Envato Market for $5. The license includes future updates and has been quality checked by Envato. Additional support is also available.
Dropify: Override Input Files with Style
Dropify is a tool that helps you create stylish input field. This is a great little tool if you are sick of plain inputs and want to showcase some of your design finesse.
The plugin comes with a drag and drop default file style or you can add your own text or images for a truly custom look. You can also set the height of the input box, combine options, disable the input altogether, add a maximum file size or use events.
And it all works with a little jQuery magic. Just clone in the project in your workspace, download the package, compile the assets and you are ready to roll with Dropify. (It is important to note that you have to include the js, CSS and fonts files for everything to work smoothly.)
With the available options, Dropify has plenty of documentation to help you set everything up and get moving quickly. The options are intuitive and easy to set.
A flexible, opinionated sorting plugin for jQuery
Create an infinite wall interface.
An open source dynamic grid system with drag an drop.
Gridster is a jQuery plugin that allows building intuitive draggable layouts from elements spanning multiple columns. You can even dynamically add and remove elements from the grid. It is on par with sliced bread, or possibly better. MIT licensed. Suitable for children of all ages. Made by Ducksboard.
Extends the current functionality to allow for elements to be grouped and dragged as a group.