如何用js控制图片的图大宽度或是最大高度

Answer 1

这是很多网页前端设计者都面临的一个问题，今天通过收集整理，把我常用的方法贴出来，希望能对需要的同行朋友有点帮助~~首称贴一段js代码：<script type="text/javascript">var Image = {};function SetMiddle(image, height){/// <summary>重设图片大小后让图片相对于DIV居中</summary>if (typeof(image) == 'string') image = document.images[image] || document.getElementById(image);var div = image.parentNode;if(div.nodeName != "DIV"){div = div.parentNode;}if(image.height > 0 && image.height < height){var marginTopVal= (height - image.height) / 2;image.style.marginTop =parseInt(marginTopVal)+"px";///不加px,在火狐下不支持！}else{image.height = height;image.style.marginTop = "0px";}}Image.Resize1=function(image,width,height){if(width==null||height==null)return;image.removeAttribute('width');image.removeAttribute('height');var w = image.width, h = image.height;var scalingW=w/width,scalingH=h/height;var scaling = w / h;if(scalingW>=scalingH){image.width=width;image.height = width / scaling;}else{image.height=height;image.width = height*scaling;}}function imgReSize(imgObj,w,h){Image.Resize1(imgObj,w,h);SetMiddle(imgObj,h);}</script>下面是具体的图片调用js函数的方法：onload=imgReSize(this,628,452)函数有三个参数，第一个就不用说了吧，每二个参数是说图片的最大宽度，第三个参数是表示图片的最大高度当图片的宽高任一个大于参数里设置的值的时候，图片就会等比例缩小，且位置相对于外面的容器左右居中多的不说了，你懂的~~~

Answer 2

控制图片最大宽度和高高度，在css里面有max-width、max-height的属性，非要用js也不是不可以的，document.getElementById('id').style.maxWidth。这个属性ie6支持的不好。但是现在也不用兼容ie6了吧。如果你想宽图用最大宽度，竖图用最大高度的好，那你就加一个判断的语句再决定是max-width、还是max-height.