Question

我正在构建一个angularJS webapp，我想通过调用构造函数的方法打开一个YouTube视频。为此;我想重现与

相同的行为

   $(document).ready(function() {
        $('.fancybox-media')
            .attr('rel', 'media-gallery')
            .fancybox({
                openEffect : 'fade',
                closeEffect : 'fade',
                padding: 0,
                helpers : {
                    media : {},
                    buttons : {}
                }
            });
    });

但是使用手动方式$.fancybox.open([ ... ])。有人可以指导我如何做到吗？

Answer 1

$.fancybox.open({
    content: '<iframe width="xxx" height="xxx" src="//www.youtube.com/embed/xxxxxxxx" frameborder="0" allowfullscreen></iframe>'
});

Answer 2

您不需要在fancybox API选项中将完整的iframe HTML标记设置为content，而是传递视频的网址并将type设置为iframe。你可以这样做：

jQuery(document).ready(function ($) {
    $.fancybox.open({
        href: "https://www.youtube.com/embed/jid2A7ldc_8",
        type: "iframe",
        // other API options
        openEffect: 'fade',
        closeEffect: 'fade',
        padding: 0,
        helpers: {
            buttons: {}
        }
    });
}); // ready

参见 JSFIDDLE

如何使用fancybox手动打开YouTube视频

2 个答案: