what's the best plugin for image uploading using php/jquery?
it should have a progressbar and display information like percent, speed and such.
how to do image-resizing after uploading? i'd also like to embed a watermark image
thanks
i find Uploadify very good.
http://www.uploadify.com/
Regarding watermarking images I'd use Perls GD or ImageMagik modules:
http://metacpan.org/pod/GD
https://metacpan.org/pod/Image::Magick
There are many classes to resize images
http://www.phpclasses.org/package/1450-PHP-Resize-image-from-files-in-different-formats-.html
Related
I want from user to upload an image of any size for (jpg,png,gif) format. After uploading the image I want him to crop the image (client side) using jquery and save that cropped image (php) to application folder.
Please tell me the feasible solution to make this functionality working fine.
ImageMagick is used for croping images:
http://www.sitepoint.com/crop-and-resize-images-with-imagemagick/
For using ajax:
http://www.sanwebe.com/2012/05/ajax-image-upload-and-resize-with-jquery-and-php
Given that you already have the PHP code to crop, use one of this plugins to allow the user define how she wants to crop the image and provide the data you need:
Guillotine: Very lightweight plugin that allows to crop, zoom and rotate images with touch support and it's responsive (demo).
Jcrop: Allows free selection cropping (demo).
It is simple image crop using jquery and php using cropbox.js
Please watch the following video
Simple image crop
I am using a jQuery plugin http://odyniec.net/projects/imgareaselect/ that allows cropping of an image.
I have search high and low for a tutorial that allows me to over write the file on the server with the cropped version...but found nothing of use.
I am using the basic integration of the plugin inside Facebox. This is working fine.
I have a button on the page which says 'Save', when that is clicked I would like to store the new image (cropped) on the server.
Any suggestions or need further information?
Check out this awesome tutorial
I use Jcrop for my projects works great!
http://deepliquid.com/content/Jcrop.html
http://deepliquid.com/projects/Jcrop/demos.php?demo=live_crop <--
Have you taken a look at the links at the very bottom of the plugin page? There are some useful links including this one. It should help you get started with the php side of things
Turned out the that image I was uploading was bigger than the area size of the cropping tool.
Image was 1024x768 however I resized the image to fit within 500x500 overlay.
I will need to resize and save new sized image during the upload.
Thanks for all your suggestions.
I've a site where users upload images and I'm displaying lots of images from users back to users. Most of the images are JPG but some are PNG.
I use manually created sprites for the images I have created myself but current user images are downloaded individually which adds time to page load.
I've done a bit of reading on PHP Dynamic Sprite Create like the on the links below:
http://www.mummey.org/2008/12/csprites-a-dynamic-css-sprite-generator-in-php5/
http://net.tutsplus.com/articles/news/dynamic-sprite-framework-with-php-new-plus-tutorial/
Does anyone have this functionality working and if so how/what did they use? recommendations?
cheers
I would combine PLupload (plupload.com) with the CSS Sprite Class from PHPClasses.org (http://www.phpclasses.org/package/6560-PHP-Generate-sprite-images-and-CSS-to-use-image-styles.html).
I recommend using PLupload because of the client-side image resizing feature, which can cut down on a lot of server processing.
I am trying to build a system that allows a user to select an image from their own computer, and crop it using the jCrop tool from jQuery. My question is can I show the image the user has selected from their system without uploading it to a system, I dont really want to do two uploads, unless I can do the first upload silently? Any help would be great.
Thank you.
You don't have to upload twice. Just upload the image at first time
Use jCrop and send image Thumbnail's coordinates(x,y), width and height.
Resize Image according to them
AFAIK, not using JavaScript and HTML (4) at the moment.
Flash can do image processing before upload - SWFUpload for example can resize images before uploading (doesn't support cropping though), but I don't know an Open Source implementation of a Cropping tool in Flash.
It will probably also be possible using HTML 5.
However, I don't see how you would need two uploads to do this? Isn't it 1. Upload 2. Show with Cropper 3. send Crop info to PHP script that processes the uploaded file?
Any recommendations for how to resize & crop images in a PHP web app? Ideally will integrate into the UI to allow user to upload, preview, then optionally resize and crop.
Thanks,
Graham
Here is a jquery cropping plug-in.
http://deepliquid.com/content/Jcrop.html
and here's a php code to crop an image (you'll find code to upload an image there as well)...
it even provides for a rough gui to select the cropped area by clicking on the image.
Here's a PHP + JQuery script that looks promising
http://www.webmotionuk.co.uk/php-jquery-image-upload-and-crop-v11/