jquery（fancyzoom）打開父框架項目

我給自己適合試圖做一些事情，我甚至不知道是可能的。jquery（fancyzoom）打開父框架項目

使用頁面上的iframe中的鏈接，我想要在父級上打開一個fancyzoom框（以便該框不被框邊遮擋）。我認爲，fancyzoom box內容div必須居住在父母身上，但我無法讓它在那裏打開。我只在父母，孩子，父母和孩子中包含了花式縮放代碼，無濟於事。我曾嘗試通過在代碼之前和代碼中添加.parent來調用父級框架，但無濟於事。

任何想法？

這裏是父頁面（電流斷開）狀態：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 

<title>iframe zoom test</title> 
<link href="nstyle.css" rel="stylesheet" type="text/css" /> 

<!-- 
    jQuery library 
--> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> 

<!-- 
    fancyzoom 
--> 
<script type="text/javascript" src="fancyzoom.min.js"></script> 
    <script type="text/javascript" charset="utf-8"> 
    $(document).ready(function() { 
    $('#medium_box_link').fancyZoom({width:400, height:300}); 
    }); 
</script> 
</head> 
<body> 

<a href="#medium_box" id="medium_box_link">Alaska</a> 
<div id="medium_box"> 
<h2>All about Alaska</h2> 
<p><strong>Here is some info about my time in Alaska</strong> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus vitae risus vitae lorem iaculis placerat. Aliquam sit amet felis. Etiam congue. Donec risus risus, pretium ac, tincidunt eu, tempor eu, quam. Morbi blandit mollis magna. Suspendisse eu tortor. Donec vitae felis nec ligula blandit rhoncus.</p> 
</div> 
<iframe src="iframetest.html" width="85" height="700" scrolling="no" FRAMEBORDER="0" name="frame" /> 

</body> 
</html>

，這裏是孩子框架：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 

<title>iframe zoom test</title> 
<link href="nstyle.css" rel="stylesheet" type="text/css" /> 
<!-- 
    jQuery library 
--> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script> 
<!-- 
    fancyzoom 
--> 

<script type="text/javascript" src="fancyzoom.min.js"></script> 
    <script type="text/javascript" charset="utf-8"> 
    $(document).ready(function() { 
    $('#medium_box_link').fancyZoom({width:400, height:300}); 
    }); 
</script> 
</head><body><a href="#medium_box" id="medium_box_link"'>Alaska</a> 
<div id="medium_box"> 
<h2>All about Alaska</h2> 
<p><strong>Here is some info about my time in Alaska</strong> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus vitae risus vitae lorem iaculis placerat. Aliquam sit amet felis. Etiam congue. Donec risus risus, pretium ac, tincidunt eu, tempor eu, quam. Morbi blandit mollis magna. Suspendisse eu tortor. Donec vitae felis nec ligula blandit rhoncus.</p> 
</div> 
</body> 
</html>

我試圖修改

$('#medium_box_link').fancyZoom({width:400, height:300});

到be

window.parent$('#medium_box_link').fancyZoom({width:400, height:300});

甚至

$('#medium_box_link',window.parent).fancyZoom({width:400, height:300});

，但無濟於事。我正在努力做甚麼？

在此先感謝您的幫助或指點！

來源

2009-11-12 Stephen

似乎沒有人能夠做到這一點，所以我轉移到另一個解決方案使用floatbox（here）。雖然花費20美元，但它確實以我最小的麻煩需要。縮放可以從iframe內部或外部的任何元素進行工作，並且可以很順利地進行選擇。

來源

2009-11-17 14:40:37 Stephen

在父窗口中調用函數的基本語法是window.parent.function。

但是，我不確定您調用的父函數是在其原始上下文中還是在子框架窗口的上下文中進行評估的。過去我在跨幀調用$（）函數時遇到了問題。

如果你仍然有問題，請嘗試在父窗口中創建一個包裝函數，像這樣：

function initZoom() { 
    $('#medium_box_link').fancyZoom({width:400, height:300}); 
}

，然後調用該包裝從孩子框架：

window.parent.initZoom();

可能強迫它。否則，你可能嘗試類似以下內容：

$(window.parent).children('#medium_box_link').fancyZoom({width:400, height:300});

但我有一種感覺，可能仍然昏迷了。

來源

2009-11-13 06:48:05

感謝您的回覆。可悲的是，我試過這個，它不起作用。任何其他想法？ – Stephen 2009-11-13 13:08:33

jquery（fancyzoom）打開父框架項目

回答

相關問題