While doing a project in X-Cart I was asked to integrate a gallery into the product list page of the website. The purpose was to display the shop product using that gallery, but the problem was the size of the product image, it was too big and we need to resize it dynamically so that it could fit inside the gallery, while keeping the proportionality of the image. So I found a script to do it and modify it according to our need. Below are the snap shots of the original script which I used for my project.

initial state of the images

resize image with the script
Above is the initial state of the images which can be resized using this script. Below I have resize the left image using the ‘+’ button and the image did not get distorted it retained its original ratio, because of the script I used. This is pretty easy; all you need the complete working example to test it, so

I am giving you the whole script to resize your website image dynamically while keeping the proportionality of the image. The code is very simple and you can understand it very easily if see it carefully. You can download the whole working example of the script from the download link below.

Dynamic Resize Image Script: Download

Latest posts by Soumyajit Dutta

  • Share/Bookmark