Adaptive Processing of Web Images

This article summarizes three methods for Adaptive Processing of web images. The specific solutions are as follows:

Method 1:

function drawImage(ImgD,ImgDWidth,ImgDHeight){var image=new Image();image.src=ImgD.src;if(image.width/image.height>=ImgDWidth/ImgDHeight){if(image.width>ImgDWidth){ImgD.width=ImgDWidth;ImgD.height=(image.height*ImgDWidth)/image.width;}else{ImgD.width=image.width;ImgD.height=image.height;}}else{if(image.height>ImgDHeight){ImgD.width=(image.width*ImgDHeight)/image.height;ImgD.height=ImgDHeight;}else{ImgD.width=image.width;ImgD.height=image.height;}}}

Method 2:

 <script language =" javascript "> // automatic image adjustment mode. The value 1 indicates proportional adjustment, and the value 2 indicates size adjustment. Var resizemode = 1 function imgresize (o) {if (resizemode = 2 | o. onmousewheel) {if (o. width> 500) {o. style. width = '500px ';} if (o. height> 800) {o. style. height = '800px ';} else {var parentNode = o. parentNode. parentNode; if (parentNode) {if (o. offsetWidth> = parentNode. offsetWidth) {o. style. width = '000000';} else {var parentNode = o. parentNodeif (parentNode) {if (o. offsetWidth> = parentNode. offsetWidth) {o. style. width = '000000' ;}}}</script>

The third method (solved by Jquery), the key code is as follows:

$ ('# Ac_content img '). each (function () {appropriate_width = 300; if ($ (this ). width ()> appropriate_width?#((this=.css ({'width': appropriate_width + 'px ', 'height': $ (this ). height () * appropriate_width/$ (this ). width () + 'px '}); $ (this ). attr ('title', 'click to view large image'); $ (this ). bind ({click: function () {window. open ($ (this ). attr ('src '));}});}});

Articles you may be interested in

• Three solutions for ineffective page refresh caused by Js, css, and images cached on webpages
• Mobile phone website width automatically adapts to mobile phone screen
• Automatically adjust the image width during webpage Loading
• Copy a webpage and add copyright information automatically
• Powerful PHP image processing class (watermark, transparency, zoom, sharpen, rotate, flip, cut, reversed)
• Js address bar special effects (display the size of all images with links on the page and view the height of the current browser)
• Prohibit web page right-click, copy, save as, View Source file and other functions to implement web page source code protection
• How to optimize website pages and increase webpage loading speed