FancyBox 不会播放 youtube 视频 [重复]答案

【问题标题】：FancyBox Will Not Play youtube video [duplicate]FancyBox 不会播放 youtube 视频 [重复]
【发布时间】：2015-07-03 11:45:08
【问题描述】：

我很难让 Jquery fancybox 插件播放 youtube 视频。我已经浏览了其他人在此站点上发布的一些解决方案，但我仍然在某个地方遗漏了一些东西，但我看不到它。编码等领域的新手。

好的。在这里，我制作了一个快速测试页面并抓取了一个随机的 youtube 视频。这是我的页面代码的外观：

  <!doctype html>
  <html>
  <head>
  <meta charset="UTF-8">
  <title>Untitled Document</title>

  <script type="text/javascript" src="jQuery/jquery-1.11.3.js"></script>
  <link rel="stylesheet" href="fancyapps-fancyBox-        18d1712/source/jquery.fancybox.css" type="text/css" media="screen" />

  <script type="text/javascript" src="fancyapps-fancyBox-18d1712/source/jquery.fancybox.pack.js"></script>

  <script type="text/javascript" src="fancyapps-fancyBox-18d1712/source/helpers/jquery.fancybox-media.js"></script>


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


$(document).ready(function() {
    $('.videos').fancybox({
        openEffect  : 'none',
        closeEffect : 'none',
        helpers : {
        media : {}
        }
    });
});
</script>

<style type="text/css">
</style>
</head>


<body>
<ul class="list">
<li><a class="videos" href="https://www.youtube.com/watch?v=hS5CfP8n_js">Youtube</a></li>
</ul>

</body>
</html>

谁能帮忙？

【问题讨论】：

标签： javascript jquery html css fancybox

【解决方案1】：

您是否尝试过here 的答案？

$(".videos").click(function() {
    $.fancybox({
        'padding'       : 0,
        'autoScale'     : false,
        'transitionIn'  : 'none',
        'transitionOut' : 'none',
        'title'         : this.title,
        'width'         : 640,
        'height'        : 385,
        'href'          : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
        'type'          : 'swf',
        'swf'           : {
        'wmode'             : 'transparent',
        'allowfullscreen'   : 'true'
        }
    });

    return false;
});

如果您的链接已经直接指向嵌入式版本，您可以将 href 更改为 this.href 或直接删除。

【讨论】：