2013-01-19 95 views
1

可能重複:
call Fancybox in parent from iframe的fancybox iframe的畫廊

您好我有iframe在我的主頁。裏面是一個畫廊,我想在我的父頁面打開圖片,當我點擊fancybox圖片。我嘗試了任何東西,但它只打開一張圖片,沒有帶有下一個和上一個按鈕的完整圖庫。

我的例子:

index.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <meta http-equiv="imagetoolbar" content="no" /> 
    <title>FancyBox 1.3.4 | Demonstration</title> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
    <script> 
     !window.jQuery && document.write('<script src="jquery-1.4.3.min.js"><\/script>'); 
    </script> 
    <script type="text/javascript" src="./fancybox/jquery.mousewheel-3.0.4.pack.js"></script> 
    <script type="text/javascript" src="./fancybox/jquery.fancybox-1.3.4.pack.js"></script> 
    <link rel="stylesheet" type="text/css" href="./fancybox/jquery.fancybox-1.3.4.css" media="screen" /> 
    <link rel="stylesheet" href="style.css" /> 

    <script type="text/javascript"> 
     function readyFancy(){ 
      $("a#sample").trigger("click"); 
     } 
     function callMe(site){ 
      $("#sample").fancybox({ 
       'transitionIn'  : 'none', 
       'transitionOut'  : 'none', 
       'href'    : ''+site+'', 
       'autoScale'   : true, 
       'onStart'   : function(){$("body").css({'overflow':'hidden'});}, 
       'onClosed'   : function(){$("body").css({"overflow":"visible"});} 
      }); 
     readyFancy(); 
     } 
    </script> 

</head> 
<body style="padding: 20px;"> 
<a href="#" id="sample"></a> <!-- here we set a decoy link for the frame to be triggered--> 
<p>Below is an iframe</p> 
<iframe src="sample.html" width="300" height="200"> <!--the link of the iframe--> 
</body> 
</html> 

sample.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
</head> 
<body > 
<div> 
<a onClick="parent.callMe('http://localhost/fan/1_b.jpg');" href="#" ><img src="1_s.jpg"></a> 
<a onClick="parent.callMe('http://localhost/fan/2_b.jpg');" href="#" ><img src="2_s.jpg"></a> 
</div> 
</body> 
</html> 
+0

你是在合作浮誇的東西。請檢查http://stackoverflow.com/a/8855410/1055987確保您檢查DEMO和父代和iframed頁面(庫)的源代碼。 – JFK

+0

你有鏈接供下載,因爲我按照說明嘗試過,但它不起作用 – user1993243

+0

抱歉,沒有鏈接下載(這個想法是提供幫助,而不是做其他人的工作;),演示應該足夠了...比較代碼 – JFK

回答

1

如果您正在使用ID作爲選擇$("#selector").fancybox();然後切換到班 - $(".selector").fancybox();

+0

是的,但這並不能解決我的問題 – user1993243

+0

它應該。你更新你的jQuery嗎? –

+0

你不明白我想要什麼 – user1993243