jQuery Image Cloning Script

29 May 2009

Posted by Jake Rutter as CSS/Web Standards, JavaScript/Ajax, jQuery

I recently ran into an issue at work where we have been spending countless hours making 6 and 12 bottle shots by hand in Photoshop. We would take one bottle and copy/clone it over 6 or 12 times, then save and resize the image for the web. It became so repetitive that I created a little script that would do the same thing, but only using one image and some fancy jQuery.

Here is my script:

JavaScript and jQuery

CSS to float the images left:

HTML to display the images:

See it in action:
jQuery Bottle Clone Example

No Comments

Category CSS/Web Standards, JavaScript/Ajax, jQuery

You can follow any responses to this entry through the RSS 2.0 feed.

No Responses to “jQuery Image Cloning Script”




XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

By submitting a comment here you grant Jake Rutter – Front-End Developer and Designer, CSS, JavaScript and jQuery, PHP, Wordpress, Expression Engine, Magento a perpetual license to reproduce your words and name/web site in attribution. Inappropriate comments will be removed at admin's discretion.