在彩盒灯箱中显示html5视频标签

Question

我正在尝试使用彩盒灯箱显示HTML5。我这样做的方式是这样的：

var html ='<video>'+sources+'</video>';
$.colorbox({html:html});

其中sources是包含源标记的html的变量。我的问题是即使出现彩盒灯箱，视频也不显示。我已经检查过Firebug，整个HTML都在那里。知道为什么它可能不显示它吗？

感谢。

Answer 1

您可以使用内嵌html模式

显示它

$( document ).ready( function() {
    $( '#openColorbox' ).colorbox( {
        inline  : true, 
        width   : '80%', 
        height  : 'auto', 
        href    : '#inlinevideocontent'
    } );
} );

这是你的内联div

<div style='display:none'>
        <div id='inlinevideocontent' >
        <video controls="controls" src="video.mp4" />
        </div>
</div>