HTML 5 Upload Image, Ratio with Drag and Drop

A HTML5 Upload image tool, full use of HTML5 with canvas (with fallback options). Together with a ratio and drag & drop makes this tool ideal for use in a CMS.

Features

• uses canvas to crop the image, no server scripts needed!
• want to use a server script, no problem! simple change it with additional options
• full HTML5 support
• touch support! Works on tablet and mobile!
• Responsive design option
• save your image with AJAX or use the tradional FORM input file element
• uses ratio to let it fit your screen or element
• easy to use
• additional options to configure
• bootstrap 3.1
• jQuery 1.9

UPDATE: jan. 24

• New: Download button
• New: Force not saving and pushing your own save function

UPDATE: nov. 21

• Improvement: Script is working with tablet and phone!
• New: Resize option added for responsive design

UPDATE: nov. 17

• New: Save original option added

UPDATE: oct. 24

• Bugfix: Tools appear when reediting form
• Bugfix: Rounding floats to int

UPDATE: oct. 20

• Bugfix: Input required will remain after deleting image

UPDATE: oct. 13

• Improvement: Saving button show directly when clicking
• Improvement: Mimetype on toDataURL
• Improvement: Hide buttons with data-button-edit = false
• Improvement: Set save text with data-save-label = “Saving”
• Improvement: Documentation
• Bugfix: Background text not hidding with transparent PNG
• Bugfix: Wrong script usage in demo

UPDATE: oct. 6

• New: Server image
• New: POST only dimensions
• Improvement: Buttons all have own CSS label for your own implementation

Update september 25th

• NEW: existing image preview
• NEW: remove existing image or uploaded image
• IMPROVEMENT: Better error response
• IMPROVEMENT: PHP script examples
• BIGFIX: ajax=false not removing editor
• BUGFIX: double image with canvas