YouTube:如何显示嵌入视频与声音无声

时间:2021-08-24 18:56:30

I'm trying to embed a video with the sound muted but I can not figure out how it make it work.

我试着嵌入一个声音柔和的视频,但我不知道它是如何工作的。

Currently I'm using this but doesn't work:

目前我在用这个,但是没用:

<iframe src="https://www.youtube.com/embed/uNRGWVJ10gQ?rel=0&amp;autoplay=1" width="560" height="315" frameborder="0" allowfullscreen></iframe>

Any of you knows how can I make this work ?

你们中有谁知道我该怎么做?

13 个解决方案

#1


7  

Updated

更新

Add &mute=1 to the end of your url.

在你的url的末尾添加&mute=1。

Your new code would be:

您的新代码将是:

<iframe src="https://www.youtube.com/embed/uNRGWVJ10gQ?rel=0&amp;autoplay=1&mute=1" width="560" height="315" frameborder="0" allowfullscreen></iframe>

Old Answer

旧的答案

You're going to have to add Javascript to mute the audio. Add an id to your iframe: Then retrieve the id with javascript: var myVideo = iframe.getElementById('myVideo'); myVideo.mute();

您将不得不添加Javascript以使音频静音。向iframe添加id:然后使用javascript: var myVideo = iframe. getelementbyid ('myVideo')检索id;myVideo.mute();

Also see the mute section in the Youtube API reference https://developers.google.com/youtube/js_api_reference?csw=1

还可以在Youtube API引用https://developers.google.com/youtube/js_api_reference?

And the question: How do I automatically play a Youtube video (IFrame API) muted?

问题是:如何自动播放Youtube视频(IFrame API) ?

#2


82  

For me works using &autoplay=1&mute=1

我的工作是使用&自动播放=1,静音=1

#3


27  

Take the source url, for example:

以源url为例:

http://www.youtube.com/embed/1r2a3n4d5o6m/

http://www.youtube.com/embed/1r2a3n4d5o6m/

then add ?mute=1 to the end, so:

然后加上?mute=1到结尾,所以:

http://www.youtube.com/embed/1r2a3n4d5o6m/?mute=1

http://www.youtube.com/embed/1r2a3n4d5o6m/?mute=1

There are additional player parameters in google's documentation.

在谷歌的文档中还有其他玩家参数。

#4


16  

The accepted answer was not working for me, I followed this tutorial instead with success.

公认的答案对我不起作用,我遵循了本教程,并取得了成功。

Basically:

基本上:

<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>

#5


9  

This is easy. Just add mute=1 to the src parameter of iframe.

Example:

这是很容易的。将mute=1添加到iframe的src参数。例子:

<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/uNRGWVJ10gQ?ecver=1?控制= 0沉默= 1 &showinfo = 0 rel = 0播放= 1循环= 1播放列表= uNRGWVJ10gQ“帧边缘= " 0 " allowfullscreen > < / iframe >

#6


5  

<iframe  src="https://www.youtube.com/embed/7cjVj1ZyzyE?autoplay=1&loop=1&playlist=7cjVj1ZyzyE&mute=1" frameborder="0"  allowfullscreen></iframe>

mute=1

沉默= 1

#7


3  

<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>

#8


1  

Source: https://developers.google.com/youtube/iframe_api_reference

来源: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>

#9


1  

I would like to thank the friend who posted the codes below in this area. I finally solved a problem that I had to deal with all day long.

我要感谢在这一领域张贴下面代码的朋友。我终于解决了一个整天要处理的问题。

<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>

#10


0  

Just pass mute=1.

只是通过沉默= 1。

For example:

例如:

<iframe id="myVideo" src=https://www.youtube.com/embed/k0DN-BZrM4o?rel=0&amp;autoplay=1;mute=1" width="100%" height="600" frameborder="0" allowfullscreen></iframe>

#11


-1  

was also looking for a solution to this but I wasn't including via iframe, mine was linked to images/video.mp4 - found this https://www.w3schools.com/tags/att_video_muted.asp - and I simply added < video controls muted > (CSS/HTML 5 solution), but no JS required for me...

我也在寻找解决方案,但我没有通过iframe,我的是链接到图像/视频。找到这个https://www.w3schools.com/tags/att_video_mu.asp -我只是添加了 <视频控件消弱的> (CSS/HTML 5解决方案),但是我不需要JS…

#12


-3  

<iframe width="560" height="315" src="https://www.youtube.com/embed/ULzr7JsFp0k?list=PLF8tTShmRC6vp9YTjkVdm1qKuTimC6K3e&rel=0&amp;autoplay=1&controls=1&loop=1" rel=0&amp frameborder="0" allowfullscreen></iframe>

#13


-4  

Try this

试试这个

<iframe width="420" height="315" src="http://www.youtube.com/embed/
HeQ39bLsoTI?autoplay=1&cc_load_policy=1" volume="0" frameborder="0"
allowfullscreen></iframe>

don't forget to write volume="0"

不要忘记写入volume="0"

#1


7  

Updated

更新

Add &mute=1 to the end of your url.

在你的url的末尾添加&mute=1。

Your new code would be:

您的新代码将是:

<iframe src="https://www.youtube.com/embed/uNRGWVJ10gQ?rel=0&amp;autoplay=1&mute=1" width="560" height="315" frameborder="0" allowfullscreen></iframe>

Old Answer

旧的答案

You're going to have to add Javascript to mute the audio. Add an id to your iframe: Then retrieve the id with javascript: var myVideo = iframe.getElementById('myVideo'); myVideo.mute();

您将不得不添加Javascript以使音频静音。向iframe添加id:然后使用javascript: var myVideo = iframe. getelementbyid ('myVideo')检索id;myVideo.mute();

Also see the mute section in the Youtube API reference https://developers.google.com/youtube/js_api_reference?csw=1

还可以在Youtube API引用https://developers.google.com/youtube/js_api_reference?

And the question: How do I automatically play a Youtube video (IFrame API) muted?

问题是:如何自动播放Youtube视频(IFrame API) ?

#2


82  

For me works using &autoplay=1&mute=1

我的工作是使用&自动播放=1,静音=1

#3


27  

Take the source url, for example:

以源url为例:

http://www.youtube.com/embed/1r2a3n4d5o6m/

http://www.youtube.com/embed/1r2a3n4d5o6m/

then add ?mute=1 to the end, so:

然后加上?mute=1到结尾,所以:

http://www.youtube.com/embed/1r2a3n4d5o6m/?mute=1

http://www.youtube.com/embed/1r2a3n4d5o6m/?mute=1

There are additional player parameters in google's documentation.

在谷歌的文档中还有其他玩家参数。

#4


16  

The accepted answer was not working for me, I followed this tutorial instead with success.

公认的答案对我不起作用,我遵循了本教程,并取得了成功。

Basically:

基本上:

<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>

#5


9  

This is easy. Just add mute=1 to the src parameter of iframe.

Example:

这是很容易的。将mute=1添加到iframe的src参数。例子:

<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/uNRGWVJ10gQ?ecver=1?控制= 0沉默= 1 &showinfo = 0 rel = 0播放= 1循环= 1播放列表= uNRGWVJ10gQ“帧边缘= " 0 " allowfullscreen > < / iframe >

#6


5  

<iframe  src="https://www.youtube.com/embed/7cjVj1ZyzyE?autoplay=1&loop=1&playlist=7cjVj1ZyzyE&mute=1" frameborder="0"  allowfullscreen></iframe>

mute=1

沉默= 1

#7


3  

<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>

#8


1  

Source: https://developers.google.com/youtube/iframe_api_reference

来源: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>

#9


1  

I would like to thank the friend who posted the codes below in this area. I finally solved a problem that I had to deal with all day long.

我要感谢在这一领域张贴下面代码的朋友。我终于解决了一个整天要处理的问题。

<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>

#10


0  

Just pass mute=1.

只是通过沉默= 1。

For example:

例如:

<iframe id="myVideo" src=https://www.youtube.com/embed/k0DN-BZrM4o?rel=0&amp;autoplay=1;mute=1" width="100%" height="600" frameborder="0" allowfullscreen></iframe>

#11


-1  

was also looking for a solution to this but I wasn't including via iframe, mine was linked to images/video.mp4 - found this https://www.w3schools.com/tags/att_video_muted.asp - and I simply added < video controls muted > (CSS/HTML 5 solution), but no JS required for me...

我也在寻找解决方案,但我没有通过iframe,我的是链接到图像/视频。找到这个https://www.w3schools.com/tags/att_video_mu.asp -我只是添加了 <视频控件消弱的> (CSS/HTML 5解决方案),但是我不需要JS…

#12


-3  

<iframe width="560" height="315" src="https://www.youtube.com/embed/ULzr7JsFp0k?list=PLF8tTShmRC6vp9YTjkVdm1qKuTimC6K3e&rel=0&amp;autoplay=1&controls=1&loop=1" rel=0&amp frameborder="0" allowfullscreen></iframe>

#13


-4  

Try this

试试这个

<iframe width="420" height="315" src="http://www.youtube.com/embed/
HeQ39bLsoTI?autoplay=1&cc_load_policy=1" volume="0" frameborder="0"
allowfullscreen></iframe>

don't forget to write volume="0"

不要忘记写入volume="0"