將YouTube嵌入到網站中,除了使用iframe語法之外,能利用以下程式碼,實現載入頁面後自動YouTube播放影片、預設聲音為靜音、關閉片尾推薦影片、隱藏影片標題、自動循環播放與隱藏YouTube Logo等功能,讓視頻放到網頁中可以有更理想的呈現方式。(※你也可以用:YouTube嵌入語法產生器)
在開啟網頁時自動播放嵌入的YouTube影片,且預設聲音為靜音。
請複製以下程式碼,依照需求自行變更播放器參數。
*如果要取消靜音,請把.mute
拿掉。
*要關閉片尾或播放時的推薦影片請加入rel: 0,
*其他數值要變更調整數字0改為1。可參考官方YouTube播放器参数。
<div id="muteYouTubeVideoPlayer"></div>
<script async src="https://www.youtube.com/iframe_api"></script>
<script>
function onYouTubeIframeAPIReady() {
var player;
player = new YT.Player('muteYouTubeVideoPlayer', {
videoId: '2ymhllPMCrg', // YouTube 影片 ID
width: 650, // 播放器寬度 (in px)
height: 356, // 播放器長度 (in px)
playerVars: {
autoplay: 1, // 自動播放視頻
controls: 1, // 顯示播放/暫停按鈕
showinfo: 0, // 隱藏影片標題
modestbranding: 1, // 隱藏YouTube LOGO
loop: 1, // 循環播放
fs: 0, // 隱藏全螢幕視窗按鈕
cc_load_policty: 0, // 隱藏關閉字幕
iv_load_policy: 3, // 隱藏影片註釋
autohide: 0 // 播放時隱藏影片控制按鈕
},
events: {
onReady: function(e) {
e.target.mute(); // 靜音
}
}
});
}
// Written by @labnol
</script>
原文網址:How to Embed a YouTube Video with Sound Muted
延伸閱讀:YouTube教學、YouTube嵌入語法產生器