Problem with HTML 5 video, the video is not playing - wordpress

I used this code but it only Run on Incognito.
video playing proper in private browser but not playing in chrome, mozila. how it can be solved please help me i tired in 8 days
<video controls muted>
<source src="https://www.w3schools.com/tags/movie.mp4" type="video/mp4">
<source src="https://www.w3schools.com/tags/movie.ogg" type="video/ogg">
Your browser does not support the video tag.

Related

Remove the big play button appears on <video> tag in firefox mobile

I've been struggeling with this one for a long time and haven't found a solution yet.
I have a preloader on my friend's website which I built (he insist of keeping it)
the preloader is applied with the video tag like so:
<video muted autoplay loop playsinline preload frameborder="0" width="100" height="100">
<source src="/media/preloader.webm#t=0.25" type="video/webm">
<source src="/media/preloader.mp4#t=0.25" type="video/mp4">
<source src="/media/preloader.mov#t=0.25" type="video/quicktime">
</video>
on all browser that's working great, but on firefox mobile before video is playing I see this play button(for half a second):
https://i.stack.imgur.com/YRpal.png
What can I do to remove this annoying button for good?

How to play videos of different formats in html using video tag

I have a page where I need to display videos with different extensions.
Example: .mp4, .wmv
<video width="100%" controls>
<source data-ng-src="{{video.url}}" type="video/*">
Your browser does not support this video.
</video>
I just put a star but it is not playing my video.Showing an empty screen.Can anyone please suggest me help.Thanks.
In case you need it to support multiple types of videos, you must add multiple source of those videos. The browser picks the appropriate one to play.
And moreover, your code doesn't contain the src attribute.
<video width="100%" controls>
<source src="http://www.educationalquestions.com/video/ELL_PART_5_768k.wmv" type="video/wmv">
<source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
<source src="https://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg">
Your browser does not support HTML5 video.
</video>

How to remove HTML5 video player navigation button

I am using HTML5 video player to play video constantly.Every thing is fine except the video navigation button displaying at the last of the video screen as soon as the mouse cursor moves over the video. I want to remove or hide it but not getting how to do it ..
Here is the HTML for the Video used..
<video id='video-player' autoplay="autoplay" loop preload='metadata' controls>
<source src="Video/1.MP4" type="video/mp4">
</video>
Please help me to remove the navigation bar from the last ..Thanks..
You can disabled controls via Javascript:
document.getElementById('video-player').controls = false
Or simply remove controls attribute:
<video id='video-player' autoplay="autoplay" loop preload="metadata">
<source src="Video/1.MP4" type="video/mp4">
</video>

Remove Controls from JS Video

I'm looking to remove the controls from a JS player that I have embedded on a site. The idea is to have the video autoplay with no controls.. Here is my code:
<video id="Splash1" class="video-js vjs-default-skin"
controls="off" autoplay preload="auto" width="1280" height=""
="http://video-js.zencoder.com/oceans-clip.png"
data-setup='{"example_option":true}'>
<source src="movie/Splash1.mp4" type='video/mp4' />
<source src="movie/Splash1.webm" type='video/webm' />
<source src="movie/Splash1.ogv" type='video/ogg' />
</video>
I was following the instructions and I removed just controls - but then the autoplay and video does not work. However, if I put back in controls the autoplay works but I have the controller playing along the bottom.
Any tips on how to get rid of the controller? Thanks so much in advance!

Support of Video in different browser

i have a task to Upload video and play in different browser. i have tried playing a .Mp4 video on different browser
i have tried implementing the iframe like
<iframe id="frame1" runat="server" visible="false" style="height: 222px; width: 482px;">
</iframe>
and tried implementing it src at runtime as:
frame1.Visible = true;
frame1.Attributes.Add("src", objLessionsInfo.VideoPath.ToString());
It works at chrome. but not in firefox and IE
I also tried implemeting the video tag of HTML5 as
<video controls="controls" tabindex="5" class="Video">
<source src="Videos/2.webm" type="video/webm" >
<source src="Videos/2.ogv" type="video/ogv">
<source src="Videos/2.mp4" type="video/mp4">
Your browser does not support the <code>video</code> element.
</video>
the same works at Chrome but not in Firefox and IE as .mp4 works on chrome but firefox doesn't support. i have tried with .webm format it plays at firefox.
i am confuse with the concept of how to make a video support to a different browser or how to structure this task.
whether should i check browser and play a video for that particular browser ( in this case i have to upload a video in different browser)
or is there any universal plugin that can play a video in all browser
need help on it. Thanks for any assistance.
Try a HTML5 video plug-in, like
Mediaelementjs.com
videojs.com
those plug-ins are automatically taken care of your browser compatibilities. ".mp4" is the good enough. If you don't have other video extentions(.ogg or .webm), plug-ins will automatically convert it to FLASH object.

Resources