利用JS解决ie6不支持max-width,max-height问题的方法_Javascript教程-查字典教程网
利用JS解决ie6不支持max-width,max-height问题的方法
利用JS解决ie6不支持max-width,max-height问题的方法
发布时间:2016-12-30 来源:查字典编辑
摘要:今天遇到一个关于用js解决ie6不支持支持max-width,max-height的问题,刚开始用jQuery方法来实现,不过一直获取不到c...

今天遇到一个关于用js解决ie6不支持支持max-width,max-height的问题,刚开始用jQuery方法来实现,不过一直获取不到css里面的值,如

复制代码 代码如下:

if($.browser.msie && $.browser.version == 6.0)

{

var maxWidth = parseInt($('.viewBigPic img').css('max-width'));

$('.viewBigPic img').each(function(){

if ($(this).width() > maxWidth)

$(this).width(maxWidth);

});

}

不知道是什么原因,获取不到css里面的最大值,然后只能用原生的js来实现

js代码如下:

复制代码 代码如下:

<script type='text/javascript'>

function setPhotoSize(elem, width, height) {

<[endif]-->

}

</script>

部分的html代码如下:

复制代码 代码如下:

<div>

<div>

<p><img id="imgid" onload="setPhotoSize(this,730,470)" src="images/viewShow.jpg" alt=""/></p>

</div>

</div>

css样式如下:

复制代码 代码如下:

.viewBigBox{ border:1px solid #e3e3e3; background-color:#ffffff; padding:1px; margin-top:18px;}

.viewBigPic{ background-color:#f7f7f7;padding:20px 14px;}

.viewBigPic p{display:table-cell;width:730px; line-height:470px; overflow:hidden; vertical-align:middle; text-align:center; height:470px;*font-size:390px;}

//实现图片垂直居中,主要运用了font-size与height的比例

.viewBigPic p img{ vertical-align:middle; max-height:470px; max-width:730px;}

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类