将iFrame中的Fancybox扩展到外部 [英] Extend Fancybox inside an iFrame to outside

问题描述

我在这里遇到了问题。我在iFrame中有一个fancybox，它正常工作，但我需要它扩展到iFrame之外，这样它就可以填满整个屏幕（我的意思是扩展到它的父节点）。

I got stuck in a problem here. I have a fancybox inside an iFrame, and it works normally, but I need it to extend outside the iFrame so it can fill the whole screen (I mean extend to it's parent).

有人知道怎么做吗？

推荐答案

如果页面和iframe都在同一个域中，那么你可以从iframe内部打开父级中的fancybox窗口。查看演示。

If both the page and the iframe are in the same domain, you can open the fancybox window in the parent from inside the iframe. Check out the demo.

父窗口（包含fancybox脚本，css和iframe）

Parent Window (contains fancybox script, css and iframe)

<iframe src="child-page.htm" height="250" width="500"></iframe>

子页面（包含在父级中调用fancybox的脚本）

Child Page (contains script to call fancybox in the parent)

$('a').click(function() {
  // target the parent window (same domain only)
  // then call fancybox in the parent
  // You can add any HTML you want inside the fancybox call
  window.parent.$.fancybox('<img src="http://farm5.static.flickr.com/4058/4252054277_f0fa91e026.jpg" height="333" width="500">');
});

这篇关于将iFrame中的Fancybox扩展到外部的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！