使用$ .fancybox()onclick打开Youtube视频

时间:2012-09-24 04:34:32

标签: jquery fancybox

我正在尝试使用以下代码在灯箱中打开Youtube链接:

<a href="#" onclick="$.fancybox( ['http://www.youtube.com/watch?v=123'] );">Click me</a>

灯箱会闪光,但不是Youtube播放器,而只是网址的静态文本。

1 个答案:

答案 0 :(得分:0)

HTML标记

 <a class="video"  title="The Falltape" href="http://www.youtube.com/v/ZeStnz5c2GI?fs=1&amp;autoplay=1"><img src="images/1.jpg" alt="" /></a>

jQuery Markup

jQuery(document).ready(function() {

   $(".video").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;
   });
});

使用的代码是通过快速谷歌搜索找到的。 http://webdesignandsuch.com/fancybox-youtube-videos/