预加载外部页面以在Fancybox（灯箱）弹出窗口中显示

Question

我有一个页面使用Fancybox 2根据用户操作显示图像和/或外部页面。我一直在使用iframe加载页面：

$('#userbtnclick1').click(function() {
  $.fancybox({
    'height' : $(window).height()*0.75,
    'width' : $(window).width()*0.75,
    'href' : 'http://an.external.destination.com',
    'title' : 'fancybox caption',
    'type' : 'iframe'
  });
});

虽然很明显一些外部网页需要一段时间才能加载，但同时屏幕仍然是灯箱空白。我看到Fancybox有一个AJAX方法，但看起来它是为页面片段设计的，而不是整个外部网站。

是否可以在$（document）.ready {}中异步预加载外部网站，将其存储为隐藏的DIV，然后在用户单击按钮时调用它？想法是它会在用户点击时加载？

Answer 1

是。删除'type'和'href'，添加'content'并将其值设置为$（'＃div-where-your-preloaded-content-is'）。