我正在使用JavaScript库在网页上排列少量图片。以下浏览器：
按计划呈现页面，Chrome浏览器出现问题。它弄乱了完整的布局。
上述浏览器不会加载任何内容，除非所有图像都已下载，直到它显示一个空白的白色屏幕，突然它将显示所有呈现完美的内容。对于Chrome，浏览器会随时随地显示内容，就像您可以看到以扫描线方式显示的图像一样。
我试过调用在里面安排这些图像的函数：
<head></head>
并且它没有解决问题，我尝试在</body>中调用此函数，也在关闭public class CustomTXT extends TextView {
public CustomTXT(Context context) {
super(context);
Typeface face=Typeface.createFromAsset(context.getAssets(), "gandom-bold.ttf");
this.setTypeface(face);
}
public CustomTXT(Context context, AttributeSet attrs) {
super(context, attrs);
Typeface face=Typeface.createFromAsset(context.getAssets(), "gandom-bold.ttf");
this.setTypeface(face);
}
public CustomTXT(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
Typeface face=Typeface.createFromAsset(context.getAssets(), "gandom-bold.ttf");
this.setTypeface(face);
}
protected void onDraw (Canvas canvas) {
super.onDraw(canvas);
}
}
之前调用此函数，但也没有修复它。这是与Chrome相关的问题吗？
应该调用函数的正确时间点是什么？
答案 0 :(得分：1)
网上有一个很棒的图书馆，其全名imagesLoaded旨在解决您的问题！当然，它应该在跨浏览器中运行，因此在Chrome或其他浏览器中的行为没有差异。
在它的帮助下，您可以在所有图像加载到特定DOM元素或由jQuery选择器控制的元素时运行代码。像：
$('body').imagesLoaded( function() {
// images have loaded
});
如果您需要，还支持.done，.fail，.progress个回调，请查看文档。
答案 1 :(得分：1)
在某些情况下，您必须等到图像加载才能获得<img>标记中未指定的参数，例如高度。然后您可以使用$(window).load
在其他情况下，例如，在图像中添加一些类，您可以在图像加载之前完成。
如果您想在页面完全加载后或者当用户真正滚动并查看每个图像时加载图像，Lazy Load是一个很好的插件，它支持回调。
答案 2 :(得分：0)
图像应首先加载为隐藏，然后您的脚本应该像
一样运行$(document).ready(function(){
// here do the scripting may be showing them one by one
});