jQuery play iframe embedded YouTube video on page load

Question

I would like to auto play Iframe embedded youtube video on page or document load not any click event.

I have tried following ways but it does not play in chrome & mobile device.

<iframe width="800" height="400" src="https://www.youtube.com/embed/W0LHTWG-UmQ?autoplay=1" frameborder="0" allowfullscreen></iframe>

Second Way

jQuery(document).ready(function() {
  jQuery('#playvideo').click(function(ev) {
  
  jQuery("#video_played")[0].src += "&autoplay=1";
    ev.preventDefault();
  });
  
  setTimeout(function() {
    jQuery('#playvideo').trigger('click');
  }, 4000);

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<iframe id="video_played" src="https://www.youtube.com/embed/W0LHTWG-UmQ?controls=0&showinfo=0&rel=0&loop=1&playlist=W0LHTWG-UmQ&autoplay=1" frameborder="0" allowfullscreen></iframe>
<a rel="wp-video-lightbox"  style="display: none;" href="#" id="playvideo">Play video</a>

I only want to play youtube embedded video during load page not any clicking event.

Possible duplicate of [YouTube Iframe embed auto play](https://stackoverflow.com/questions/7281765/youtube-iframe-embed-auto-play) — Govind Samrow, Aug 10 '17 at 09:56
It's not duplicate i want autoplay during load page & i faced issue in chrome browser & mobile devices , I also tried my custom js script that i have mentioned above. — David, Aug 10 '17 at 09:57
@GovindSamrow already that answer added in question , and he mentioned its not working :p — Durga, Aug 10 '17 at 09:57
Have you tried moving `jQuery("#video_played")[0].src += "&autoplay=1";` out of the click event? — Lewis Browne, Aug 10 '17 at 09:58
@LewisBrowne , yes i have tried that way also but it's not work. — David, Aug 10 '17 at 10:02
@Shiladitya that code is not working in responsive in mobile. — David, Aug 10 '17 at 12:42

score 3 · Answer 1 · answered Aug 22 '18 at 17:25

3

Wont autoplay on chrome unless you add mute to video. mute=1

answered Aug 22 '18 at 17:25

Steve Wojcik

41
4

where? can you provide an example? – Wallen Sep 22 '20 at 02:39
@Wallen. Here is an example: of the `mute=1` parameter: `` – Denis Molodtsov Jan 18 '22 at 00:56

Shiladitya · Answer 2 · 2017-08-10T12:55:49.207

1

Here you go with a solution https://codepen.io/Shiladitya/pen/prwJKB

iframe {
  width: 100%
}

<iframe height="345" src="http://www.youtube.com/embed/oHg5SJYRHA0?rel=0&autoplay=1" frameborder="0" allowfullscreen></iframe>

Just add ?rel=0&autoplay=1

edited Aug 10 '17 at 12:55

answered Aug 10 '17 at 10:02

Shiladitya

12,003
15
25
38

I already tried it but now working in chrome browser & mobile – David Aug 10 '17 at 12:16
May be cache issue. – Shiladitya Aug 10 '17 at 12:19
`` I tested the code in my local, its working. I changed the `youTube` video – Shiladitya Aug 10 '17 at 12:51
Not working in Iphone 6, have you checked in responsive. – David Aug 10 '17 at 12:53
Have a look into`https://stackoverflow.com/questions/12496144/can-you-autoplay-html5-videos-on-the-ipad` – Shiladitya Aug 10 '17 at 12:57

score 0 · Answer 3 · answered Mar 01 '18 at 12:44

you can add autoplay=1 in the end of the youtube link. please refer below.

     <iframe width="1280" height="720" src="https://www.youtube.com/embed/ofKxLfdUGnk?autoplay=1" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>

jQuery play iframe embedded YouTube video on page load

3 Answers3