在iFrame中點擊時全屏顯示燈箱？

Question

這是我的頁面：http://ilijaveselica.com/Gallery/GetCroatiaFavPhotos

我想將此頁面實現到另一個網站。我嘗試使用iframe，但lightbox（fancybox）僅在iframe中打開，而不是在整個頁面中打開。任何想法我怎麼能解決這個沒有太多的痛苦？

下面是它的外觀：http://www.croatia-photography.com/

Answer 1

我能想象這樣做的唯一的辦法是包括的fancybox腳本本身內的畫廊元素。

因此，在你http://ilijaveselica.com/Gallery/GetCroatiaFavPhotos頁面，而不是有這樣的：

$(".fancybox-thumb").fancybox({ 
// API options here 
}); 

...和畫廊的每幅圖像所有的隱藏的HTML錨，有這樣的事情：

$('.gallery').click(function(e){ 
e.preventDefault(); 
parent.$.fancybox([ 
    {href:'images/01.jpg', title: '01'}, 
    {href:'images/02.jpg', title: '02'}, 
    {href:'images/03.jpg', title: '03'} 
],{ 
    // API options here 
}); // fancybox 
}); // click 

請注意，我們在括號內提供href和title。另請注意，我們使用parent.$.fancybox來指示fancybox將在父頁面和iframe外部打開。

那麼你就需要打開iframe外廊唯一的HTML是：

<a class="gallery" href="javascript:;"><img src="{thumbnail}" alt="" /></a> 

更多參考和DEMO（見更新），檢查此https://stackoverflow.com/a/8855410/1055987