加载第一张图片后触发 onload 事件

Posted 2023-03-10

【中文标题】加载第一张图片后触发 onload 事件

【英文标题】：Fire onload event after loading the first image

【发布时间】：2018-02-19 18:37:35

【问题描述】：

我有一个网站的“屏幕截图”，我们假设它已经在浏览器缓存中。

我希望图像是在浏览器中打开该网站的 URL 时首先加载的内容。将其视为某种预加载器。

onload 事件应在此之后立即触发。 （=基本上立即） 这只是为了美观的原因，停止浏览器向用户显示加载动画。

之后，应该加载页面的其余部分。完成后，应删除图像。

所以按照这个顺序：

显示预加载的图片 让浏览器认为页面已完全加载 加载实际网站 隐藏预加载器图片

有什么方法，干净还是肮脏？

【问题讨论】：

你的问题是“为我做我的工作”之类的，先自己试试

【参考方案1】：

像这样使用图像上的“加载”事件。

<div>
<img src="yourpreloadimage.gif" id="img" />
</div>

<script>

$("#img").on('load', function() 
$("#img").hide();
  alert("image is loaded. Hide image and show rest of page.");
);
</script>