我搜索并尝试了各种解决方案,我想要实现,无济于事
我正在一个摄影网站上工作,该摄影网站的大量图像加载在iframe中,需要一点时间才能加载.我想在iframe中显示加载gif图像,直到图像加载完毕.
这是有关网站,http://www.chriszachary.com/portfolio
我正在使用一个javascript运动库来允许用户使用鼠标控制图像滚动.在页面完全加载之前,图像不会滚动.为了帮助减少混乱,我认为加载gif图像会更有效率,但我无法拉开它.如果您点击任何投资组合类别(婚礼,参与,肖像),您会注意到加载图像的重要等待时间.
如果有人能让我知道如何在iframe中实现这一点,请让我知道.如果你可以具体说明使用什么代码,在哪里,我是一个新手:|
提前感谢,期待一个答案:)
解决方法
用下面的HTML替换该页面中的IFRAME标签. IFRAME被DIV覆盖,其中找到加载图像(或任何图像).图像位于DIV区域的中心,其大小可高达950×633像素.加载IFRAME页面时,加载图像将被隐藏.
您需要更改的是您网站的图片网址.您可能还需要更改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>