如何显示Fancybox预加载图像

Question

我正在使用Fancybox。

当点击以下链接时，模态窗口会打开，但只是在内容加载时显示一个白色框。

<a class="iframe"  href="/icons/?icon_for=<%=@user.class.name%>&category=<%=Icon::USER_DEFAULT%>" id="user_iframe">
                                        <%= image_tag("avatar-bis.png", :width => 140, :height => 128, :class => "dotted")%>
                                </a>

所以我想在内容加载时显示动画图像。 单击链接时调用以下内容：

<script>
      $('a.iframe').live("click",function(){
        $('#fancybox-loading').show();
        });
</script>

这会产生以下结果：

然而，它不是动画。这是一个静态图像。如何加载它以显示动态图像？

感谢。

Answer 1

对于Fancybox 2，正确使用的方法是$.fancybox.showLoading();和$.fancybox.hideLoading();

Answer 2

您可以使用这些fancybox的API：

显示加载动画：

$.fancybox.showActivity()   

隐藏加载动画：

$.fancybox.hideActivity()