YouTube: Wie man eingebettetes Video mit stummgeschaltetem Sound präsentiert
Ich versuche, ein Video mit stummgeschaltetem Ton einzubetten, kann aber nicht herausfinden, wie es funktioniert.
Zur Zeit verwende ich das, aber es funktioniert nicht:
<iframe src="https://www.youtube.com/embed/uNRGWVJ10gQ?rel=0&autoplay=1" width="560" height="315" frameborder="0" allowfullscreen></iframe>
Jeder von euch weiß, wie ich das schaffen kann?
Aktualisierte
Fügen Sie &mute=1 am Ende Ihrer URL hinzu.
Ihr neuer Code wäre:
<iframe src="https://www.youtube.com/embed/uNRGWVJ10gQ?rel=0&autoplay=1&mute=1" width="560" height="315" frameborder="0" allowfullscreen></iframe>Alte Antwort
Sie müssen Javascript hinzufügen, um den Ton stummzuschalten. Fügen Sie Ihrem iframe eine ID hinzu: Rufen Sie dann die ID mit Javascript ab: var myVideo = iframe.getElementById ('myVideo'); myVideo.mute ();
Siehe auch den Abschnitt zum Stummschalten in der Youtube-API-Referenz https://developers.google.com/youtube/js_api_reference?csw=1
Und die Frage: Wie kann ich ein Youtube-Video (IFrame API) automatisch stummschalten? </ s>
Für mich arbeitet &autoplay=1&mute=1
Nehmen Sie zum Beispiel die Quell-URL:
dann füge ?mute=1 am Ende hinzu, also:
In Googles Dokumentation gibt es zusätzliche Player-Parameter.
Die akzeptierte Antwort funktionierte nicht für mich, ich folgte diesem Tutorial stattdessen mit Erfolg.
Grundsätzlich gilt:
<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: 'YOUR_VIDEO_ID', // YouTube Video ID
width: 560, // Player width (in px)
height: 316, // Player height (in px)
playerVars: {
autoplay: 1, // Auto-play the video on load
controls: 1, // Show pause/play buttons in player
showinfo: 0, // Hide the video title
modestbranding: 1, // Hide the Youtube Logo
loop: 1, // Run the video in a loop
fs: 0, // Hide the full screen button
cc_load_policy: 0, // Hide closed captions
iv_load_policy: 3, // Hide the Video Annotations
autohide: 0 // Hide video controls when playing
},
events: {
onReady: function(e) {
e.target.mute();
}
}
});
}
// Written by @labnol
</script>
Das ist einfach. Einfach hinzufügen stummschaltung = 1 auf den Parameter src von iframe.
Beispiel:
<iframe src="https://www.youtube.com/embed/uNRGWVJ10gQ?ecver=1?controls=0&mute=1&showinfo=0&rel=0&autoplay=1&loop=1&playlist=uNRGWVJ10gQ" frameborder="0" allowfullscreen></iframe>
<iframe src="https://www.youtube.com/embed/7cjVj1ZyzyE?autoplay=1&loop=1&playlist=7cjVj1ZyzyE&mute=1" frameborder="0" allowfullscreen></iframe>stummschaltung = 1
<iframe width="560" height="315" src="https://www.youtube-nocookie.com/embed/ObHKvS2qSp8?list=PLF8tTShmRC6uppiZ_v-Xj-E1EtR3QCTox&autoplay=1&controls=1&loop=1&mute=1" frameborder="0" allowfullscreen></iframe>
<iframe width="560" height="315" src="https://www.youtube.com/embed/ObHKvS2qSp8?list=PLF8tTShmRC6uppiZ_v-Xj-E1EtR3QCTox&autoplay=1&controls=1&loop=1&mute=1" frameborder="0" allowfullscreen></iframe>
Quelle: https://developers.google.com/youtube/iframe_api_reference
<div id="player"></div>
<script>
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height: '720',
width: '1280',
videoId: 'M7lc1UVf-VE',
playerVars :{'autoplay':1,'loop':1,'playlist':'M7lc1UVf-VE','vq':'hd720'},
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
function onPlayerReady(event) {
event.target.setVolume(0);
event.target.playVideo();
}
var done = false;
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING && !done) {
// setTimeout(stopVideo, 6000);
done = true;
}
event.target.setVolume(0);
}
</script>
Ich möchte mich bei dem Freund bedanken, der die Codes in diesem Bereich veröffentlicht hat. Ich habe endlich ein Problem gelöst, mit dem ich den ganzen Tag beschäftigt war.
<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: 'xCIBR8kpM6Q', // YouTube Video ID
width: 1350, // Player width (in px)
height: 500, // Player height (in px)
playerVars: {
autoplay: 1, // Auto-play the video on load
controls: 0, // Show pause/play buttons in player
showinfo: 0, // Hide the video title
modestbranding: 0, // Hide the Youtube Logo
loop: 1, // Run the video in a loop
fs: 0, // Hide the full screen button
cc_load_policy: 0, // Hide closed captions
iv_load_policy: 3, // Hide the Video Annotations
autohide: 0, // Hide video controls when playing
rel: 0
},
events: {
onReady: function(e) {
e.target.setVolume(5);
}
}
});
}
// Written by @labnol
</script>Pass einfach mute=1.
Zum Beispiel:
<iframe id="myVideo" src=https://www.youtube.com/embed/k0DN-BZrM4o?rel=0&autoplay=1;mute=1" width="100%" height="600" frameborder="0" allowfullscreen></iframe>