我用的是最新版本的fancybox。我正試圖創建一個垂直HTML5視頻圖庫。但是fancybox會自動計算長寬比,最后我得到如下結果:
如何制作一個全屏視頻?
要使用Fancybox以全屏模式顯示視頻,可以使用iframe選項并將aspectRatio設置為& quottrue & quot。這將迫使視頻填滿整個屏幕。下面是一個示例代碼片段:
$("[data-fancybox]").fancybox({
iframe: {
css: {
width: "100%",
height: "100%",
},
attr: {
allowfullscreen: true,
},
aspectRatio: true,
},
thumbs: false, // Disable thumbnails if you don't need them
buttons: [
"zoom",
"fullScreen",
"close",
],
});
<a data-fancybox data-type="iframe" data-src="video-url" href="javascript:;">
<img src="thumbnail-url" alt="Video Thumbnail">
</a>
上一篇vue date比較
下一篇vue data銷毀