HTML/CSSでYouTubeの動画を背景で使ったところエラー153動画プレーヤーの設定エラーとなるのですがこれYouTube動画を背景にするというのは諦めた方がいいのでしょうか?自分が作るのはjavascriptでYouTube apiを読み込ませ、メインの見出しとかをアニメーションをつけて動かすでことしてたりはします

JavaScriptYouTube

1件の回答

回答を書く

1186187

2026-06-20 09:55

+ フォロー

YouTubeの動画をウェブサイトの背景として使用する際に「エラー153 動画プレーヤーの設定エラー」が発生しているようですね。

このエラーはいくつかの理由で発生する可能性があります:

1. 埋め込み制限:動画の所有者が埋め込みを制限している場合
2. 地域制限:特定の国や地域での視聴が制限されている場合
3. YouTube APIの使用制限や設定の問題

YouTube動画を背景として使用する方法としては、以下の代替案があります:

YouTube IFrame APIを正しく設定する
JavaScript
// YouTube IFrame APIの読み込み
var tag = document.createElement('script');
tag.src = \u0026quot;YouTube.com/iframe_api\u0026quot;;">https://www.YouTube.com/iframe_api\u0026quot;;
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

// プレーヤーの初期化
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
videoId: '動画ID',
playerVars: {
'autoplay': 1,
'controls': 0,
'showinfo': 0,
'rel': 0,
'loop': 1,
'playlist': '動画ID'
},
events: {
'onReady': onPlayerReady
}
});
}

function onPlayerReady(event) {
event.target.mute(); // 自動再生のためにミュート
event.target.playVideo();
}


・CSSで背景として配置
css
#player {
position: fixed;
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -1;
transform: translateX(-50%) translateY(-50%);
}


・代替案として、動画をMP4形式でダウンロードして(著作権に注意)HTMLのvideo要素で背景として使用する方法もあります。

・または、動画の代わりに静止画像やCSSアニメーションを使用することも検討してみてください。

エラー153が続く場合は、別の動画IDを試すか、YouTube APIの公式ドキュメントを確認して設定を見直してみることをお勧めします。

うったえる有益だ(0シェアするブックマークする

関連質問

Copyright © 2026 AQ188.com All Rights Reserved.

博識 著作権所有