Ali Habibzadeh Web Portfolio

Image zoom

jQuery UI is a powerful library which brings neat and user friendly functionalities into your site, however it can be large or you might only be intrested in certain things it contains and not all of it

I have developed this simple plugin which takes advantage of how jQuery UI draggable works and it allows you to add dragging and zoom functionality to any image on your site.

This would be very suitable for pages which you might have very large images for but not have enough space for them

You can set the site and scaling both for the container and the image to suit your webpage.

How to implement

		        
			    $(document).ready(function() {
                    // class of your image
                    $('.ZoomImage').ImageZoom({ 

                        // this can be 1x, 2x, ...
                        zoomLimit: 1,
                        // set the size when image loads
                        renderScale : 0.8 
                        
                    });
                });
		        
	        

• View demonstration
• Download the code