Question

我正在尝试在iFrame中嵌入Google地图（在我的页面上弹出）。当我远程查看它时，它可以完美地工作，但是一旦我做到它就会立即生效＃34;它给了我错误＆＃34; Google Maps Embed API必须在iframe＆＃34;中使用。看起来我的一个链接不起作用，但我检查了一切，似乎找不到任何东西。任何帮助将不胜感激！这是我的代码：

 <!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">
 <head>
<title></title>
<link rel="stylesheet" href="menu_style.css" type="text/css" />


 <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
 <script type="text/javascript" src="http://fancyapps.com/fancybox/source/jquery.fancybox.pack.js?v=2.1.4"></script>
 <link rel="stylesheet" type="text/css" href="http://fancyapps.com/fancybox/source/jquery.fancybox.css?v=2.1.4" media="screen" />

 <script type="text/javascript">
 $(document).ready(function() {
    $(".google_iframe").fancybox({
        'width'             : '75%',
        'height'            : '75%',
        'autoScale'         : false,
        'transitionIn'      : 'none',
        'transitionOut'     : 'none',
        'type'              : 'iframe'
    });
});

 </script>

 </head>
 <body>

  <p>If you would like directions / to view this on a map, please click <a class="google_iframe" href="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3321.2500604451925!2d-117.99007100000004!3d33.650681999999996!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x80dd2111f91606ff%3A0xb1395267ce8b8e5c!2sHyatt+Regency+Huntington+Beach+Resort+and+Spa!5e0!3m2!1sen!2sus!4v1395732654186">here</a>.</p>

 </body>
 </html>

Answer 1

fancyapps.com不是CDN，当您从网络服务器请求这两个文件（js + css）时，他们不提供文件。

将文件上传到您自己的服务器或从CDN加载它们（例如cloudflare）：

 <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.pack.js"></script>
 <link rel="stylesheet" type="text/css" href="http://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.min.css" media="screen" />

＆＃34;必须在iframe中使用Google Maps Embed API。＆＃34;

1 个答案: