限制图片宽度或高度
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>jquery限制图片宽度</title>
<script language="javascript" src="http://pay.fy5.com/statics/js/jquery.min.js"></script>
<script language="javascript" type="text/javascript" >
$(function(){
var imgs=$('.asds img');
imgs.each(function(){
if($(this).width() >370){
$(this).width(370);
}
});
});
</script>
</head>
<body>
<div class="asds"><a href="pic/0db2c9cab10b690bf31fe72b.jpg"><img src="pic/0db2c9cab10b690bf31fe72b.jpg" /></a></div>
</body>
</html>
1、css控制方法
结合css和其支持的expression实现的，示例代码如下：
<title>控制图片的最大高宽</title>
<style type="text/css">
.clear{clear:both;}
.widthimg{width: expression(this.width > 200 ? '200px': true); max-width: 200px; }
</style>
<body>
<div class="clear">
<img class="widthimg" src="../image/mm.jpg" />
</div>
<div class="clear">
<img src="../image/xx7.jpg" />
</div>
</body>
2、JS方法：
<img src="yukiiak.jpg" onload="javascript:if(this.width>300)this.width=300">
这句代码能把超过300宽度的图片变为300宽， 小于300的图片保持原尺寸不变。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>限制图片尺寸的JS代码</title>
<script type="text/javascript">
function imgwh(){
var img = document.getElementById("divheight");
var imgkuandu=img.offsetHeight;
var imgkuanduwidth=img.offsetWidth;
if(imgkuandu>=500){
document.getElementById("divheight").style.height="500px";
}
if(imgkuanduwidth>=600){
document.getElementById("divheight").style.width="600px";
}
}
</script>
</head>
<body>
<img src="01.jpg" onload="imgwh();" id="divheight" /><br />
限制了图片尺寸<br />
<img src="01.jpg" /><br />
没有限制的尺寸
</body>
</html>