指尖世界

分享的乐趣

js控制页面上展示的图片大小

类别: 观点 更新时间: 2016-08-29
[摘要:img.js (function($) { // $(document).ready(function(){ $.AutoResizeImage = function(maxWidth, maxHeight, objImg) { ]

img.js

(function($) { //    $(document).ready(function(){         $.AutoResizeImage = function(maxWidth, maxHeight, objImg) {             var img = new Image();             img.src = objImg.src;             var hRatio;             var wRatio;             var Ratio = 1;             var w = img.width;             var h = img.height;             wRatio = maxWidth / w;             hRatio = maxHeight / h;             if (maxWidth == 0 && maxHeight == 0) {                 Ratio = 1;             } else if (maxWidth == 0) {//                 if (hRatio < 1) Ratio = hRatio;             } else if (maxHeight == 0) {                 if (wRatio < 1) Ratio = wRatio;             } else if (wRatio < 1 || hRatio < 1) {                 Ratio = (wRatio <= hRatio ? wRatio : hRatio);             }             if (Ratio < 1) {                 w = w * Ratio;                 h = h * Ratio;             }             objImg.height = h;             objImg.width = w;         }     //})  })(jQuery);
html.html

<div style="margin-left:480px;">     <img id="img" src="images/1.jpg" onload="javascript:$.AutoResizeImage(250,250,this);" > </div>

感谢关注 V8指尖世界JS频道,v8en.com是专门为互联网人打造的学习交流平台,全面满足互联网人工作与学习需求,更多互联网资讯尽在 V8指尖世界!