0

刚刚实现了 Fancybox 以在页面加载时弹出 - 然而,当用户点击离开 fancybox 回到网站时,歌曲将再次开始播放。关于可能导致这种情况的任何想法?

链接:像我们这样的人网站

<!-- FANCYBOX POPUP -->
<a class="popupLink" href="#popup"></a>
<div id="popup">
     <iframe width="853" height="480" src="http://www.youtube.com/embed/Qw7k_erTgow?autoplay=1" frameborder="0" allowfullscreen></iframe>
</div>
<!-- .popup -->

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

     window.setTimeout('$(".popupLink").trigger("click")', 100);
});
</script>

<script type="text/javascript">
$("a.more").click(function() {
$.fancybox({
        'padding'       : 0,
        'autoScale'     : false,
        'transitionIn'  : 'none',
        'transitionOut' : 'none',
        'title'         : this.title,
        'width'         : 680,
        'height'        : 495,
        'href'          : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
        'type'          : 'swf',
        'swf'           : {
             'wmode'           : 'transparent',
            'allowfullscreen'  : 'true'
        }
    });
4

1 回答 1

0

首先,为了避免潜在的冲突,你应该加载一个 jQuery 版本(你有两个:v1.4 和 v1.7)

其次,与 jQuery 一样,您正在加载两个不同版本的 fancybox(您有:v1.3.4 和 v2.0.3)

第三,我个人认为为视频添加 iframe 并不是一个好主意,inline因为您无法真正控制iframe. 此外,它可能会增加您的页面加载和其他潜在问题(例如您遇到的问题)的开销。

好消息是您可以在fancybox 中“按需”打开您的视频,换句话说,只有当您需要它而不是隐藏在您的页面中并在后台播放时...所以我建议您对您的视频进行这些更改代码 :

html

<a class="popupLink" href="http://www.youtube.com/embed/Qw7k_erTgow?autoplay=1&wmode=opaque"></a> 

...并删除内联 iframe<div id="popup"><iframe ...></div>

js

$(document).ready(function() {
  $(".popupLink").fancybox({
    "padding": 1,
    "type": "iframe",
    "width": 853,
    "height": 480
  });
  window.setTimeout('$(".popupLink").trigger("click")', 100);
}); // ready
于 2013-08-21T02:02:08.093 回答