有沒有一種方法嵌入YouTube視頻作爲網頁的背景與HTML，CSS和JavaScript與頂部的實際網站內容？怎麼樣？youtube視頻作爲網站背景
基本上，它應該是一個自動播放的視頻，被靜音（但音量可以由訪問者開啓），並且該網站應該很好地運行在該網站之上（該網站是最小的，所以大部分視頻應始終可見）。該網站足夠小，大多數瀏覽器默認情況下都不會顯示滾動條，視頻應該是100％的寬度和高度。
例子？鏈接？
嘗試谷歌，但無法找到它。
它也應該適用於不在YouTube上的視頻。
HTML5和CSS3首選:)
我真的需要一個活生生的例子在別處（或者接近），因爲我嘗試了所有的（可用通過谷歌和失敗的）
也相關 - 根據我自己的研究，似乎沒有任何放慢YouTube視頻播放的方式（例如：減慢24倍） - 真/假？
那麼你可以絕對的位置標籤或，使用CSS來設置高度和寬度。使用javascript來模擬點擊按鈕。將元素zIndex設置爲背景。
你可能已經找到了解決方案現在只是如果你有沒有......你試過http://www.seanmccambridge.com/tubular/？
<div style="position: fixed; z-index: -99; width: 100%; height: 100%">
<iframe frameborder="0" height="100%" width="100%"
src="https://youtube.com/embed/ID?autoplay=1&controls=0&showinfo=0&autohide=1">
</iframe>
</div>
// Replace ID with the actual ID of your YouTube video
http://www.labnol.org/internet/youtube-video-background/27933/
爲了完整起見，這裏將http://okfoc.us/okvideo/。 Vimeo也是。
嗨，因爲管狀非常複雜，我爲您提取了必要的代碼 。
的html代碼：
<div id="player-container" style="overflow: hidden; position: absolute; width: 100%; height: 100%;">
<div id="player" style="position: absolute">
</div>
這裏來了完整的YouTube API封面樣式的東西，從 管狀提取。 jquery是必需的。另外，標準的YouTube HTML5的iframe API 代碼必須包括 - 爲給定的位置： https://developers.google.com/youtube/iframe_api_reference#Getting_Started
var ratio = 16/9;
window.onPlayerReady = function (e) {
resize();
}
$(window).on('resize', function() {
resize();
})
var resize = function() {
console.log("resize");
var heightcorrection = 0,
width = $(window).width(),
pWidth, // player width, to be defined
height = $(window).height() - heightcorrection,
pHeight, // player height, tbd
$videoPlayer = $('#player');
if (width/ratio < height) { // if new video height < window height (gap underneath)
pWidth = Math.ceil(height * ratio); // get new player width
$videoPlayer.width(pWidth).height(height).css({
left: (width - pWidth)/2,
top: 0
}); // player width is greater, offset left; reset top
} else { // new video width < window width (gap to right)
pHeight = Math.ceil(width/ratio); // get new player height
$videoPlayer.width(width).height(pHeight).css({
left: 0,
top: (height - pHeight)/2
}); // player height is greater, offset top; reset left
}
}
你得到了這個庫，以及：
http://florian-chapon.fr/dev/youtube-background/
你的唯一的事情是，包含js文件，並將此腳本放在您的「身體」上：
$(document).ready(function() {
ytbg("vQWlNALvbhE", 0, 17, 1);
});
作爲解釋：
ytbg("video link", starttime, endtime, volume).
哦，上帝，動畫背景回來了！ X-D對不起，我只是假設你有一個很好的理由。 :)我認爲最大的問題在於Flash播放器*可能總是位於某些瀏覽器中的任何內容之上。不知道在最近的版本中有多少問題，但它曾經是。 – deceze
lmao，是的：P的重點是，該網站是非常簡單的，並在背景中的點和視頻 - 默認情況下（可能甚至是永久性）的MUTED是提供一些'魅力'，同時使用該網站 - 將作爲人網站相當多。當然視頻使用將被仔細選擇，不要太分心或使內容不可能看到：P – b0x0rz
檢查我的iFrameless/JS/CSS唯一的解決方案在這裏https://stackoverflow.com/questions/41616179/youtube-video-header -background/45377998＃45377998 – 350D