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 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 using the form on the Support page, I’m happy to help out with any questions or problems.
“Quick response to questions and a great product.”miltonarcos
“Just wonderful plugin with great support!”coinzz
“Very good crop script… Best I could find out there.”gtlondon
“Thanks for your very fast reply to my questions!”custompixel
Today, it’s all about a nice and smooth user experience, this is where Slim delivers big time.
In this day and age, of course this plugin is responsive.
Cropping is done on the client, no image manipulation script required on the server.
Specify the output ratio, be it square (1:1), portrait(3:4), movie mode (16:9) or a custom ratio, Slim has got you covered.
Slim will automatically crop the image to best fit the specified output ratio.
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.
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.
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.
No client-side or server-side frameworks or libraries are required.
PHP Helper Class
Handy PHP helper class included. This makes it easy for you to get to the uploaded images. If you’re planning to use Slim with ASP.Net / NodeJS or any other serverside language this file should give you a good indication on how to setup Slim on the server.
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.
All texts and icons can be configured using data attributes.
And Much More
Read about all Slim’s features
onBeforeRemovalcallback so you can optionally ask if the user is sure of a image removal.
metaproperty alone for custom values.
Slim makes use of SVG icons made by Egor Rumyantsev, these icons are licensed under Creative Commons 3.0 BY.
For animations Slim makes use of Snabbt.js, blurring is done using Stack Blur and images are transformed in to manageable canvas elements with LoadImage. All three libraries available for commercial use under the MIT license.