IE8缩放Bug

最新推荐文章于 2022-11-23 17:21:36 发布

weistar103

最新推荐文章于 2022-11-23 17:21:36 发布

阅读量214

点赞数

分类专栏： HTML5

本文链接：https://blog.csdn.net/weistar103/article/details/84496118

版权

HTML5 专栏收录该内容

46 篇文章 0 订阅

订阅专栏

工作中遇到页在精确布局，使用js+css方式实现，支持浏览器包括：ie8+,firefox,chrome，結果变态的测试使用各种放大/缩小页面的测试，导致布局问题，现一点点完善中。。。

今天发现一个ie8兼容性问题：若使用css百分比定义html,body的宽高，会导致页面缩放时不触发onresize事件，具体代码如下：

<!doctype html>
<html>
<head>
    <style type="text/css">
    html,body{
        width: 100%;
        height: 100%;
        background-color: #283B48;
    }
    </style>
</head>
<body>
<div id="show">0</div>
<script>
var j = 0;
if(window.addEventListener){   
    window.addEventListener('resize', function(){
    	document.getElementById('show').innerHTML = ++j;
    }, false);   
}else{   
    window.attachEvent('onresize', function(){
    	document.getElementById('show').innerHTML = ++j;
    });   
}
</script>
</body>
</html>

解决办法：可使用js在页面加载时动态設定html,body的百分比。

weistar103

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
IE8缩放Bug

工作中遇到页在精确布局，使用js+css方式实现，支持浏览器包括：ie8+,firefox,chrome，結果变态的测试使用各种放大/缩小页面的测试，导致布局问题，现一点点完善中。。。今天发现一个ie8兼容性问题：若使用css百分比定义html,body的宽高，会导致页面缩放时不触发onresize事件，具体代码如下：&lt;!doctype html&gt;&lt;html&gt...
复制链接

扫一扫

专栏目录