首页 > 代码库 > android 浏览器对图片加载高度渲染问题
android 浏览器对图片加载高度渲染问题
今天在开发有道汉语词典移动版的时候遇到了一个很奇怪的问题。
在android设备上访问的时候,总是发现有底部背景色不能完全渲染出来的情况(有时候又是正常的,一会儿出现一会儿不出现,iphone设备也是完全ok),就是一半是底色,还有一半没了。。。
仔细观察了一下发现在打开网页的时候先显示了头部的小图片和标题以及底部的按钮,再显示中间的大图,有个加载过程。
ok,怀疑是图片还没加载完毕,导致高度计算出错,给底部设背景的时候加载完的那块就没颜色。。。
那么使用$(window).load()函数来解决!
网上有个解释:
The window load event executes a bit later when the complete page is fully loaded, including all frames, objects and images. Therefore functions which concern images or other page contents should be placed in the load event for the window or the content tag itself.
看着像哈,代码如下:
var height = document.body.clientHeight; $("#doc2").css("height", height+"px"); $("#doc2").css("background-color", "E84C32");
好吧,不管用,还是有这个现象。。。
干脆给图片加判断吧,我获取了第一个slider,然后判断它的onload
var setPosition = function(){ var height = document.body.clientHeight; $("#doc2").css("height", height+"px"); $("#doc2").css("background-color", "E84C32"); } var img = $(‘#firstimg‘); if (img.prop(‘complete‘)) { setPosition(); } else { img.load(function() { setPosition(); }); }
吼吼,搞定了,这个之后还得研究下为何window.load失效了。。。还有iphone为啥没问题。。。
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。