Problem in video autoplay

Asked

Viewed 4,508 times

9

I added a video right when starting the site and I wanted it to be on autoplay.

I know that if I put it on the page on Html5 it would run as well as I did the test. But as it is inside this box and using js, it does not start.

The code of the js script I’m using is this:

<script>
$(document).ready(function(){
   $(".iframe").colorbox({iframe:true, width:"80%", height:"80%"});
   $.colorbox({href:"comunicado.php"});
   $('#video_player').prop('autoplay', true);
});
</script>

and in the html video I’ve set so:

<video width="99%" height="500" controls="controls" autoplay="autoplay">
   <source id="video_player" src="comercial.mp4" type="video/mp4">
</video>

I tried several ways, but as I am not an expert I do not know what is happening. I would love your help!

jquery

  • remember that the browser has restrictions for videos configured with "auto play", for example they are set to mute by default

5 answers

1

Sometimes they are simple things that seem complex. your code is correct just missing vc put (muted) and (loop)

ex.:

<video autoplay="true" muted loop> 
    <source src="assets/4k-background.mp4" type="video/mp4">
    <source src="assets/4k-background.ogg">
    <source src="assets/4k-background.webm">
</video>

0

So I’ve had a similar problem with tag video

tries to add a muted inside the tag

example:

<video id="Home-vid" width="100%" autoplay="" muted="" loop="">
    <source src="files/video_home.mp4" type="video/mp4">
</video>

muted autoplay is always allowed

Here is some more information: Google Developers

0

Save Save personal, after reading much found the solution on 29/01/2020.

<embed src="audio/fazer-pedido.mp3" type="audio/mp3" autostart="true" hidden="true">
<audio id="player" autoplay><source src="" type="audio/mp3"></audio>

src="" audio element leave empty, works on Android 8.0 with Chrome 72.0... Nothing more than that.

-1

		$('document').ready(function(){
			var video = document.getElementById("meu_video"); 
			video.play();
		});
    <video width="400" controls id='meu_video'>
		  <source src="mov_bbb.mp4" type="video/mp4">
		  <source src="mov_bbb.ogg" type="video/ogg">
		  Your browser does not support HTML5 video.
	</video>

See if it works. I ran the tests here and it worked.

  • Bilico, welcome to Stack Overflow in English. A hint: when answering try to explain why you changed the code in a way that explains the problem and the person who asked understand why the change. =)

-1

In HTML it’s just autoplay.

<video width="99%" height="500" id="video" controls autoplay>
    <source id="video_player" src="comercial.mp4" type="video/mp4">
</video>

And you don’t need it:

$('#video_player').prop('autoplay', true);

Do so in your Javascript code:

document.getElementById('video').play();

And on the tag video place id="video".

  • Hello Gumball I just made the change only with autoplay and the same has not worked yet

  • Only if there are any plugin interfering in this. But I will edit my post with something you can do.

  • So I did as you asked: I added the code like this.. <script> $(Document). ready(Function(){ $(".iframe"). colorbox({iframe:true, width:"80%", height:"80%"}); $. colorbox({href:"communicated.php"}); Document.getElementById('video'). play(); }); </script>

  • but not yet given, the site for reference is the sculpconstrutora.com.br

  • This video is inside the page php statement. ?

  • Yes it is. and doing a include on the index

  • So, inside the page release.php you do <script>document.getElementById('video').play();</script>.

  • I did as you asked and still did not give the autoplay in the video, I can not understand why :(

Show 3 more comments

Browser other questions tagged jquery

You are not signed in. Login or sign up in order to post.