Firefox BUG:页面太大的时候background-image背景图片渲染出错
很简单的一个页面,如下:
<!doctype html>
<html>
<body style="background-image:url(1.gif)">
<div style="width:80000px; height:80000px;"></div>
</body>
</html>
<!doctype html>
<html>
<body style="background-image:url(1.gif)">
<div style="width:80000px; height:80000px;"></div>
</body>
</html>
一个定义了背景图片的超大页面,在Firefox下,把水平滚动条拖到很右边,或者把垂直滚动条拖到很下边,就会发现背景图片没了,或者背景图片残缺。
具体多大不确定,我的机子上,超过50000X50000一定会重现这个bug。
并且Firefox所有版本到目前为止都有这个BUG,其它浏览器IE/Safari/Chrome/Opera都没有这个问题。
如果出错的时候,再切换窗口,或者拖动滚动条,都会导致进一步错乱。
如果我们的web app不可避免的要在火狐下用到超大页面,那就只能自己模拟了,用一个浮动层来展示背景,动态调整浮动层的坐标。
摘自 无心的专栏
补充:web前端 , JavaScript ,