我搜索并尝试了各种解决方案来解决我想要实现的目标，但无济于事......
我正在一个摄影网站上工作，该网站在 iframe 中加载了大量图像，这需要一些时间来加载。我想在 iframe 中显示加载 gif 图像，直到图像完成加载。
这是有问题的网站，http://www.chriszachary.com/portfolio
我正在使用 javascript 动态库来允许用户用鼠标控制图像滚动。在页面完全加载之前，图像不会滚动。为了帮助减少混乱，我认为加载 gif 图像会更有效，但我无法完成。如果您单击任何投资组合类别（婚礼、订婚、肖像），您会注意到加载图像的等待时间很长。
如果有人可以让我知道如何在 iframe 中实现这一点，请告诉我。如果您可以具体说明使用什么代码以及在哪里使用，我是新手：|
在此先感谢，期待答案:)
用下面的 HTML替换该IFRAME页面中的标记。被找到加载图像（或任何图像）的位置IFRAME覆盖。DIV图像位于DIV区域的中心，其大小最大为 950x633 像素。加载页面时IFRAME，加载图像将被隐藏。
您需要更改的是您网站的图片 URL。您可能还想更改DIV背景颜色（当前设置为#FFF）。
<style>
#loadImg{position:absolute;z-index:999;}
#loadImg div{display:table-cell;width:950px;height:633px;background:#fff;text-align:center;vertical-align:middle;}
</style>
<div id="loadImg"><div><img src="loading.gif" /></div></div>
<iframe border=0 name=iframe src="html/wedding.html" width="950" height="633" scrolling="no" noresize frameborder="0" onload="document.getElementById('loadImg').style.display='none';"></iframe>
加载 iframe 时可以使用 jquery 触发
$('#iframeTest').on("load", function () {
console.log('iframe loaded'); //replace with code to hide loader
});