0
YouTubeの背景をミュートする方法は?ビデオは、私の角2のアプリケーションでコンポーネントテンプレートで再生する必要があります。 iframeを使用すると、たとえば角度2再生の背景にYouTube動画をミュートしました
<div class="video-background">
<div class="video-foreground">
<iframe id="myVideo" src="https://www.youtube.com/embed/TjOXLJGH0P8?controls=0&showinfo=0&rel=0&autoplay=1&loop=1&playlist=TjOXLJGH0P8" frameborder="0" allowfullscreen>
</div>
</div>
動画は表示されますが、ミュートされません。 yputubeのプレーヤーAPIを使用すると何も表示されません。 How to Embed a YouTube Video with Sound Mutedで
<script src="http://www.youtube.com/player_api"></script>
<div id="player"></div>
<script>
var player;
function onYouTubePlayerAPIReady() {
player = new YT.Player('player', {
playerVars: {
'autoplay': 1,
'controls': 0,
'autohide': 1,
'wmode': 'opaque',
'showinfo': 0,
'loop': 1,
'mute': 1,
//'start': 15,
//'end': 110,
'playlist': 'NQKC24th90U'
},
videoId: 'NQKC24th90U',
events: {
'onReady': onPlayerReady
}
});
}
function onPlayerReady(event) {
event.target.mute();
$('#text').fadeIn(400);
//why this? Well, if you want to overlay text on top of your video, you
//will have to fade it in once your video has loaded in order for this
//to work in Safari, or your will get an origin error.
}
//this pauses the video when it's out of view, just wrap your video in .m-//video
$(window).scroll(function() {
var hT = $('.m-video').height(),
wS = $(this).scrollTop();
if (wS > hT) {
player.pauseVideo();
}
else {
player.playVideo();
}
});
</script>