0

我正在尝试将 Fancybox 2.1.5 中的 youtube 视频放置在 iframe 内以延伸到所述 iframe 上，并覆盖整个页面，就像不在 iframe 内一样，而不是在 iframe 内打开 - 基本上就像在那个页面中一样，但是使用 iframe 中的代码以允许 iframe 提供的父页面中的子导航和子页面。

我花了 2 天时间在网上到处寻找，当然，虽然这里已经介绍了这个主题，但我相信答案解决了旧版本的 Fancybox，因为他们都提到 .click(function() 不在 2.1 中。 5 版本。我试图在 $(".fancybox").fancybox({ 但是......什么都没有。

我不是专业的网页设计师，只是改造我的网站，我对 JS 和 jQuery 的了解......有限。

因此，如果您愿意花时间回复，我将不胜感激。有问题的页面就是这个。您会注意到有一个子菜单（“ENGLISH W/FRENCH ACCENT”和“FRENCH”），每个链接都会打开一个放置视频的 iframe。如果您需要更多信息以帮助我，请告诉我。非常非常感谢您。

在父页面的头部我有

        <script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

<script type="text/javascript" src="/fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>

<link rel="stylesheet" href="/fancybox/source/jquery.fancybox.css?v=2.1.5" type="text/css" 
media="screen" />
<script type="text/javascript" src="/fancybox/source/jquery.fancybox.pack.js?v=2.1.5"> 
</script>

<link rel="stylesheet" href="/fancybox/source/helpers/jquery.fancybox-buttons.css?v=1.0.5"  
type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-buttons.js?
v=1.0.5"></script>
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-media.js?
v=1.0.6"></script>

<link rel="stylesheet" href="/fancybox/source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" 
type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-thumbs.js?
v=1.0.7">

</script>

在 iframe 头中我有： src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js">

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

<script type="text/javascript" src="/fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>

<link rel="stylesheet" href="/fancybox/source/jquery.fancybox.css?v=2.1.5" type="text/css"    
media="screen" />
<script type="text/javascript" src="/fancybox/source/jquery.fancybox.pack.js?v=2.1.5">
</script>

<link rel="stylesheet" href="/fancybox/source/helpers/jquery.fancybox-buttons.css?v=1.0.5" 
type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-buttons.js?
v=1.0.5"></script>
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-media.js?
v=1.0.6"></script>

<link rel="stylesheet" href="/fancybox/source/helpers/jquery.fancybox-thumbs.css?v=1.0.7" 
type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/source/helpers/jquery.fancybox-thumbs.js?
v=1.0.7"></script>

<script>
$(document).ready(function() {
$(".fancybox").fancybox({
openEffect  : 'none',
closeEffect : 'none',
prevEffect : 'none',
nextEffect : 'none',
closeBtn  : false,
arrows    : true,
nextClick : true,
helpers : {
thumbs : {
width : 121,
height : 75
}
},
afterLoad : function() {
this.title = '' + (this.index + 1) + ' of ' + this.group.length + (this.title ? ' - ' +   
this.title : '');
}
});
});
</script>

图库中的每个项目如下所示：

<div class="vidsplace"><a class="fancybox fancybox.iframe" rel="vids" href="
//www.youtube.com/embed/jy_FJN3isR0?rel=0&autoplay=1&wmode=opaque" 
title="Dolce and Gabbana worlwide TV commercial">
<img src="/data/dolcegabbana.jpg" alt="Dolce and Gabbana" />
<br />Dolce &amp; Gabbana
</a></div>

我想就是这样。我希望我已经澄清了公认的相当令人困惑的事情。

4

0 回答 0