用原生的JavaScript实现的图片等比例缩放maxwidth和maxheight在ie中不兼容问题今天用jQuery实现了这些问题
jQuery部分代码
<script type="text/javascript">
$(document)ready(function(){
var maxWidth=$("imgBox")width();
$("img")each(function(){
if(!$supportstyle&&$browsermsie&&($browserversion==)){ //判定浏览器为ie的时候
var imgWidth=$(this)width();
var imgHeight=$(this)height();
var maxHeight = maxWidth*imgHeight/imgWidth;
if(imgWidth>maxWidth){
$(this)css("width"maxWidth)css("height"maxHeight);
}
}
})
})
</script>
css部分代码
<style type="text/css">
body{ margin:; padding:;}
box{ width:px; margin: auto;}
imgBox{ background:#CCCCCC;*display:tablecell; width:px; margin:px auto; *fontsize:px; lineheight:px; textalign:center; verticalalign:middle; padding:px;}
img{ border: none; maxwidth:px; overflow:hidden; verticalalign:middle;}
</style>
html代码
<div class="box">
<div class="imgBox">
<img src="images/jpg" alt="等比例缩放图片"/>
</div>
</div>
