ecshop模板中心在经过测试后为您介绍一个简单方便的js图片等比缩放的代码:
样式:
.tab-box img{max-width:300px; max-height:200px;}
js代码:
<script type="text/javascript" language="javascript">
function imgfix() {
//定义要限制的图片宽高,这个宽高要同style里面定义的相同,小于限定高宽的图片不操作
var widthrestriction = 300;
var heightrestriction = 200;
var allelements = document.getelementsbytagname(‘*’)
for (var i = 0; i < allelements.length; i++)
{
if (allelements[i].classname.indexof(‘tab-box’) >= 0)
{
var imgelements = allelements[i].getelementsbytagname(‘img’);
for (var j=0; j < imgelements.length; j++)
{
if ( imgelements[j].width > widthrestriction || imgelements[j].height > heightrestriction )
{
if ( imgelements[j].width > imgelements[j].height)
{
imgelements[j].height = imgelements[j].height*(widthrestriction/imgelements[j].width);
imgelements[j].width = widthrestriction;
} else
{
imgelements[j].width = imgelements[j].width*(heightrestriction/imgelements[j].height);
imgelements[j].height = heightrestriction;
}
}
if ( imgelements[j].height < heightrestriction )
{
imgelements[j].style.paddingtop = ( heightrestriction -imgelements[j].height ) /2 + "px";
}
} /*for j*/
}
}/*for i*/
}
window.onload = imgfix;
</script>
,用爱生活,你会使自己幸福!用爱工作,你会使很多人幸福!