jquery - 预加载外部页面以在 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')。