Question

我有一个iframe，其中包含一个图库。在我的主网页上，我有一个图像，点击后，它会打开＆＃34;那个＆＃34; iframe与fancybox。

代码如下：

<a class="fancybox fancybox.iframe popup" href="http://tambooflores.com.mx/iframe_colores.html" height="100%" width="100%" > 

some IMAGE here
</a>

fancybox的脚本是：

 $('.fancybox').fancybox();

    $("a.popup").fancybox({
        'hideOnContentClick' : true,
        'width' : 676,
        'height' : 630,
        'type' : 'iframe',
        'padding' : 16,
        'onComplete' : function() {
            $('#fancybox-frame').load(function() { // wait for frame to load and then gets it's height

            $('#fancybox-content').height($(this).contents().find('body').height()+30);
        });
    }
    });

问题是我有8个iframe，有8个不同的画廊（每个画廊有20张）。当我点击其中任何一个时，显示它需要很长时间。

因此我想在加载主网页时加载一半图像。

我还想在每个iframe中添加这个：

The content of IFrame
<script type="text/javascript">
//<![CDATA[
   fireOnReadyEvent();
   parent.IFrameLoaded();
//]]>
</script>

请选择look at the fiddle 1.如何小时装货？ 2.如何在加载函数中改善加载或如何加载一半图像？

Answer 1

我遇到了同样的问题。我这样解决了：

获取要加载的图像大小（高度或宽度），并将此结果变量作为div高度或宽度值。就这样。

使用jQuery预加载fancybox图像iframe

1 个答案: