내 페이지에 닫을 코드가 있어도 fancybox가 닫히지 않는 이유

이것은 원격 도메인에서 외부 페이지를로드하는 데 사용되는 상위 페이지의 코드입니다.하지만이 페이지의 닫기 링크를 클릭하면 iframe 페이지가 닫히지 않습니다. 아무도 나를 안내 할 수 있습니까? 내가 잘못 가고있는 곳은 어디입니까?내 페이지에 닫을 코드가 있어도 fancybox가 닫히지 않는 이유

<!DOCTYPE html> 
<html> 
<head> 
    <title>fancyBox - Fancy jQuery Lightbox Alternative | Demonstration</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 

    <!-- Add jQuery library --> 
    <script type="text/javascript" src="../lib/jquery-1.7.2.min.js"></script> 

    <!-- Add fancyBox main JS and CSS files --> 
    <script type="text/javascript" src="../source/jquery.fancybox.js?v=2.0.6"></script> 
    <link rel="stylesheet" type="text/css" href="../source/jquery.fancybox.css?v=2.0.6" media="screen" /> 

    <script type="text/javascript"> 
     $(document).ready(function() { 

      $("#fancybox-manual-b").click(function() { 
       $.fancybox.open({ 
        href : 'http://2792.a.hostable.me/testing/instagram/tester.php', 
        type : 'iframe', 
        padding : 5 
       }); 
      }); 

     }); 
    </script> 
    <style type="text/css"> 
     .fancybox-custom .fancybox-skin { 
      box-shadow: 0 0 50px #222; 
     } 
    </style> 
</head> 
<body> 
<a id="fancybox-manual-b" href="javascript:;">Open single item, custom options</a> 
</body> 
</html>

원격 페이지의 코드는

<!DOCTYPE html> 
<html> 
<head> 
    <title>fancyBox - iframe demo</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
</head> 
<body> 
    <h1>fancyBox - iframe demo</h1> 

    <p> 
<a href="javascript:parent.$.fancybox.close();">Close me</a> 

     | 

     <a href="javascript:parent.document.returnval('asdf');">return some value</a> 
    </p> 

    <p> 
     Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam scelerisque justo ac eros consectetur bibendum. In hac habitasse platea dictumst. Nulla aliquam turpis et tellus elementum luctus. Duis sit amet rhoncus velit. Duis nisl ligula, mattis interdum blandit laoreet, mattis id ante. Cras pulvinar lacus vitae nisi egestas non euismod neque bibendum. Vestibulum faucibus libero id ante molestie ultricies. Vestibulum quis nibh felis. Vestibulum libero nisl, vehicula vel ullamcorper sit amet, tristique sit amet augue. Etiam urna neque, porttitor sed sodales lacinia, posuere a nisl. Vestibulum blandit neque in sapien volutpat ac condimentum sapien auctor. Ut imperdiet venenatis ultricies. Phasellus accumsan, sem eu placerat commodo, felis purus commodo ipsum, sit amet vulputate orci est viverra est. 
    </p> 

    <p> 
     Aenean velit est, condimentum ut iaculis ut, accumsan at mi. Maecenas velit mi, venenatis ut condimentum at, ultrices vel tortor. Curabitur pharetra ornare dapibus. Ut volutpat cursus semper. In hac habitasse platea dictumst. Donec eu iaculis ipsum. Morbi eu dolor velit, a semper nunc. 
    </p> 
</body> 
</html>

출처

2012-07-08 user1026137

http://meta.stackexchange.com/a/5235/173947 – JFK

가 열고있는 페이지는 또한 닫으려고하는 코드를 인식 할 수 없습니다 그렇지 않으면 fancybox JS 참조가 필요합니다 다음과 같다 그 자체.

최신 브라우저를 사용하는 경우 JS 오류가 표시되는 콘솔 (일반적으로 F12가 열립니다)에 액세스해야합니다.

출처

2012-07-08 09:28:07 Digbyswift

반드시 필요한 것은 아닙니다. 실제로 열린 페이지는 'close me'만 가질 수 있으며 여전히 fancybox를 닫습니다. – JFK

내 shopify 페이지에서 작동하지 않습니다 – user1026137

크롬 브라우저의 콘솔에서 다음 오류 보고서를 받았습니다 – user1026137

코드가 작동하지만 iframe을 사용하여 작업 할 때 Same Origin Policy을 고려해야합니다. 페이지를 닫으려고 할 때

, 그것은 그것이 다른 도메인에서 스크립트를 실행하는 호스트에 제한이있을 수 있음을 의미하는이 오류

Timestamp: 08/07/2012 3:50:25 AM 
Error: Permission denied to access property '$' 
Source File: javascript:parent.$.fancybox.close(); 
Line: 1

을 트리거합니다.

로컬에서 테스트하거나 두 페이지가 동일한 서버 (동일한 도메인)에 있으면 원활하게 작동합니다.

출처

2012-07-08 10:59:51 JFK

내 페이지에 닫을 코드가 있어도 fancybox가 닫히지 않는 이유

답변

관련 문제