Modern cross platform responsive image cropping and uploading. Slim features beautiful animations and graphics. Configuration and implementation are a walk in the park.
As you can see in the demo animation below, you’ll be cropping and uploading images in no time.
Slim is:
- Responsive and Beautifully Animated
- Compatible with both Bootstrap and Foundation
- Super Fast
- Able to auto crop and resize imagery
- Capable of Correcting Device Orientation problems
- Setup to upload via AJAX or Form POST
- A Treat for the Eyes
Slim live demo and docs can be found here
Slim is build using the latest HTML 5 and CSS 3 techniques.
Slim ships with extensive documentation on all it’s capabilities.
Just contact me through my CodeCanyon profile, I’m happy to help you out with any questions or problems.
FEATURES
Beautiful Animations
Today, it’s all about a nice and smooth user experience, this is where Slim delivers big time.
Responsive
In this day and age, of course this plugin is responsive.
Browser Cropping
Cropping is done on the client, no PHP image manipulation script required.
Ratio
Specify the output ratio, be it square (1:1), portrat(3:4), movie mode (16:9) or a custom ratio, Slim has got you covered.
AutoCrop
Slim will automatically crop the image to best fit the specified output ratio.
AutoSize
Specify the maximum size of the output image and Slim will scale down the image to fit perfectly.
Tip: Use AutoSize with a square ratio to quickly crop avatars.
Device Orientation
Mobile devices can embed rotation information in photographs, this often results in rotated or incorrectly read imagery. Slim automatically corrects this and presents the photo the way it should be.
AJAX and Form POST
Upload cropped images with AJAX or with a traditional form post. When using AJAX Slim shows a neat progress indicator.
Very Fast
Of course there’s a maximum amount of data your user can transfer, we can’t help that. But we can make sure Slim itself is not slowing down the users’ device. Slim’s code is optimized for performance.
On top of optimal code paths, Slims animations assist in making the cropping experience seem smooth and fast.
PHP Helper Class
Handy PHP helper class included. This makes it easy for you to get to the uploaded images.
Bootstrap and Foundation Support
Works nicely within Bootstrap and Foundation.
Easy to Configure
Setting up Slim is a matter of adding some data attributes to your HTML and presto, you’re ready to crop and upload images.
Edit Server Images
Slim can also load images via URL, this allows you to use Slim to quickly crop server images.
Tip: Line up server images, Slim will auto crop, do a visual survey, if all is fine, upload back to server.
Vanilla JavaScript and jQuery
Whether you’re an old school JavaScript fanatic or a jQuery lover, Slim’s got you both covered. The package also contains an AMD, CommonJS and Global build version of Slim.
Control Labels
All texts and icons can be configured using data attributes.
JavaScript API
You can control the cropper from your scripts using the JavaScript API.
And Much More
Read about all Slim’s features
BROWSER SUPPORT
- Chrome
- Firefox
- Opera
- Internet Explorer 10+
- Safari OSX & iOS (Safari on Windows is no longer supported by Apple)
- Android (Not all Android devices behave the same, should work on most modern Android devices)
On very old browsers ( older than Internet Explorer 8 ), Slim won’t load due to lack of JavaScript functionality. On Internet Explorer 8 and up it will show an incompatible message.
FILES
- Installation instructions
- All required CSS and JavaScript files for various project setups.
- PHP Upload Script, plus examples on how to use for From POST and AJAX uploading.
VERSION HISTORY
1.0 26-05-2016
Download Slim, Image Upload and Ratio Cropping Plugin (Images and Media)
