3

我正在尝试创建某种回调代码,该代码在预加载图像后执行。

我的JS代码如下:

<script type='text/javascript'>
d=document;
window.onload=function()
{
   if (d.images)
   {
      d.getElementById('preload').style.display='block';
      i1=new Image;
      i1.src="http://link_to_image";
      d.getElementById('preload').style.display='none';
   }
}
</script>

所以在我的例子中,d.getElementById('preload').style.display='none';应该在图像完全加载到缓存后执行。

关于如何实现这一目标的任何帮助?请仅提供没有库/插件要求的独立 JavaScript 解决方案。

4

3 回答 3

6

我不确定图像onload事件在所有浏览器中的可靠性如何,所以我会非常仔细地测试:

var i1 = new Image();

i1.onload = function() {
   d.getElementById('preload').style.display = "none";
};

i1.src = "http://link_to_image";
于 2010-02-04T15:01:32.440 回答
1

看看这篇文章,我认为它会有所帮助:链接文本

与 JavaScript 中的许多其他对象一样,Image() 对象也带有一些事件处理程序。其中最有用的无疑是 onLoad() 处理程序,它在图像完成加载时被调用。

于 2010-02-04T14:56:42.763 回答
1

在图像标签本身中使用 onload。

<img src="http://link_to_image" onload="alert('IMG LOADED')" />
于 2010-02-04T15:00:40.533 回答