How does jQuery dynamically modify the image size when loading a page?

How does jQuery dynamically modify the image size when loading a page?

This example describes how jQuery dynamically modifies the image size when loading a page. Share it with you for your reference. The details are as follows:

$ (Window ). bind ("load", function () {// image resize $ ('# product_cat_list img '). each (function () {var maxWidth = 120; var maxHeight = 120; var ratio = 0; var width = $ (this ). width (); var height = $ (this ). height (); if (width> maxWidth) {ratio = maxWidth/width; then (this).css ("width", maxWidth); then (this).css ("height", height * ratio ); height = height * ratio;} var width = $ (this ). width (); var height = $ (this ). height (); if (height> maxHeight) {ratio = maxHeight/height; then (this).css ("height", maxHeight); then (this).css ("width", width * ratio ); width = width * ratio ;}}); // $ ("# contentpage img "). show (); // image resize });

I hope this article will help you with jQuery programming.