iframe 中的进度条答案

【问题标题】：Progress bar in iframeiframe 中的进度条
【发布时间】：2012-09-03 07:53:55
【问题描述】：

我有一个主 jsp 页面，其中有两个 iframe 第一个 iframe 加载菜单 （即 leftFrame） 和其他根据菜单加载动态页面。（即 mainFrame） 我的问题是在第二个 iframe 中加载任何页面时，我必须显示微调器 （进度条）。我如何在 jquery 中对其进行编码。

这里是代码

<body>
  <table>
<tr>
    <td style="height:100%"><iframe name="leftFrame" id="leftFrame" src="leftnavigation.jsp" height="600" width="200" frameborder="0"></iframe></td>

    <td style="height:100%"><iframe name="mainFrame" id="mainFrame" src="news.jsp"  height="600" width="1000" frameborder="0" scrolling="auto"> </iframe></td>

</tr>   

</table>
</body>

Spinner.gif

脚本是什么。

提前致谢

【问题讨论】：

标签： jquery iframe progress-bar

【解决方案1】：

如果您想为您的 IFrame 添加进度指示器，您可以通过在 Iframe 顶部放置一个透明的 CSS 叠加层并在叠加层顶部呈现加载指示器来实现。

【讨论】：

【解决方案2】：

你可以通过 jquery 的.ready 函数来实现。您所要做的就是在 iFrame 顶部放置一个透明分区，让您在中心加载图像。并在 iFrame 准备好时淡出分割。

我为此做了一个演示。见DEMO HERE。

不是完美的设计，但你会明白的。

【讨论】：