<video poster="video/vr.png" id="bgvid" preload="auto"
playsinline autoplay muted loop >
<source src="video/VR-video.mp4" type="video/mp4">
<source src="video/VR-video.mp4" type="video/mp4">
</video>
When I removed muted attribute video stop playing on safari browser. I want the video to be audible
You cannot remove it programmaticly. It must Be unmuted via a user event like a click.
Related
My 2 second video not playing, but I've tried with 10 second and it worked perfectly. Why is that? Does HTML don't play videos that are shorter than 1-2 second?
It's only an image, help please.
<video autoplay loop id="video-background" muted plays-inline>
<source src="video.mp4" type="video/mp4">
</video>
mistake in your code.
try with playsinline
<video autoplay loop id="video-background" muted playsinline>
<source src="video.mp4" type="video/mp4">
</video>
source : https://developer.mozilla.org/fr/docs/Web/HTML/Element/video
in this HTML video tag, the autoplay is not working properly, I don't know what's the problem, here is the code and link which this will show the video.
<video controls autoplay id="header-video">
<source src="https://winmagictoys.com/wp-content/uploads/2019/07/hairdorables.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
this is the link with the video
https://winmagictoys.com/hairdorables/
Because Chrome don't allow autoplay media onload until user has interacted with the webpage. So you need to add an hidden autoplay iframe with silence sound.
<iframe src="silence.mp3" allow="autoplay" id="audio" style="display:none"></iframe>
You can get silence sound file from here https://github.com/anars/blank-audio/blob/master/250-milliseconds-of-silence.mp3.
So your html code should be
<video controls autoplay id="header-video">
<source src="https://winmagictoys.com/wp-content/uploads/2019/07/hairdorables.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
<iframe src="silence.mp3" allow="autoplay" id="audio" style="display:none"></iframe>
Add muted. If you want to loop, you can use loop
video {
height: auto;
vertical-align: middle;
width: 100%;
}
<video autoplay loop muted controls>
<source src="https://winmagictoys.com/wp-content/uploads/2019/07/hairdorables.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
You have to mute the video to do auto play after changing a browser policy.
Autoplay only work if your video is muted.
<video controls autoplay id="header-video" muted>
<source src="https://winmagictoys.com/wp-content/uploads/2019/07/hairdorables.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
Try this
<video onloadeddata="this.play();" poster="poster.png" playsinline loop muted controls>
<source src="video.mp4" type="video/mp4" />
<source src="video.mp4.webm" type="video/webm" />
<source src="video.mp4.ogg" type="video/ogg" />
Your browser does not support the video tag or the file format of this video.
</video>
seems like u wanna run it when the page is loaded and that is easily done with js
1st set a function in ur body tag:
<body onload="pageloaded()">
in js: var video = document.getElementById(header-video);
function pageloaded() {
video.play();
}
All is in the title. When i access a page with a video tag, autoplay works fine.But when i reload the page, the video dont start.
What can i do to auto start the video ?
<video autoplay loop poster="the_poster.jpg" id="bgvid">
<source src="video.mp4" type="video/mp4">
<source src="video.webm" type="video/webm">
<source src="video.ogv" type="video/ogg">
</video>
i try to add a ?ts=timestamp.
i try also to start the video with JS but i get a "promise error"
I've had same issue here and it solved by adding muted attribute to video tag.
For Google Chrome, according to this update note, autoplay with sound needs some conditions. However, Muted autoplay is always allowed.
If I add the muted attribute to the tag the video does mute, but the user cannot unmute the video using the default controls.
Is there anyway to have a video load up muted with the ability to unmute using default controls?
Use the muted attributed in order to mute the video.
<video controls muted>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
Can someone tell me why the following tag only showing the poster image and not the video.
<video loop preload="auto" poster="https://v.cdn.vine.co/r/thumbs/6E3D5C44EF971106677480906752_1b2782bf8bc.3.1.mp4_4k51O7l0pibzJwSKxYQnhzNhClScxGOtyylyyd97BYQc._hwWqToJivTuKAp7nE0.jpg?versionId=RbNdo0ARrcYsa1ETobYaSkGe_gyX535k">
<source src='http://v.cdn.vine.co/v/videos/A69BFCDF-56E8-44A2-AA05-DB090DAA2901-5135-000002D2B5159EF7_1.1.1.mp4' type="video/mp4">
</video>
Add the autoplay at the end of the Video TAG
<video loop preload="auto" poster="https://v.cdn.vine.co/r/thumbs/6E3D5C44EF971106677480906752_1b2782bf8bc.3.1.mp4_4k51O7l0pibzJwSKxYQnhzNhClScxGOtyylyyd97BYQc._hwWqToJivTuKAp7nE0.jpg?versionId=RbNdo0ARrcYsa1ETobYaSkGe_gyX535k" controls autoplay>
<source src='http://v.cdn.vine.co/v/videos/A69BFCDF-56E8-44A2-AA05-DB090DAA2901-5135-000002D2B5159EF7_1.1.1.mp4' type="video/mp4">
</video>
you need controls and/or autoplay
<video autoplay controls loop preload="auto"> ... </video>