Raspberry Pi - Trouble playing local video files in browser (Midori, Epiphany) - html

I've stumbled upon this problem, while coding my project.
I have this html that plays a video:
<video id="video" autoplay="autoplay">
<source src="/videos/sample.mp4" type="video/mp4"></source>
</video>
Unfortuanately it is not starting the video.
However if i set the source of the video to be taken from the web (e.x.) http://techslides.com/demos/sample-videos/small.mp4
It plays the video correctly. Does anybody know what could be a trouble in here.

Try this
<video width="720" controls autoplay loop>
<source src="sample.mp4" type="video/mp4">
Your browser does not support HTML5 video.
</video>

Related

html auto play audio not working for some reason

here is my code
<video loop="true" width = "700px" autoplay muted>
<source src="test5.mp4" type="video/mp4">
</video>
<video loop="true" width = "780px" autoplay muted>
<source src="video-copy.mp4" type="video/mp4">
</video>
<audio autoplay>
<source src="video-copy.mp3" />
</audio>
<audio autoplay>
<source src="test5.mp3" />
</audio>
for some reason the audio only plays half of the time ive tried on google chrome and opera but both same results could anyone tell me why
First off, where do you need this code to work ? Is it on a local HTML or PHP file, or on a live website ?
If you want to implement this code on a live website, do you have an SSL contract linked to your domain name (meaning is the URL starting with https:// and not http://)
I read that for security reasons, most browsers block the autoplay of audios and videos if the website is not running with a SSL contract (because the website is not secured).

Full-Screen Video iOs Devices

I am trying to make the video in my website full screen but viewing it on iphone it redirect me to the video, is there a way play the video on same page?
<video poster="poster.jpg" preload autoplay loop>
<source src="vimeo.mp4" type="video/mp4">
To get the best experience of this website please consider updating your web browser
</video>
~
<video <video poster="poster.jpg" preload autoplay loop playsinline>
<source src="vimeo.mp4" type="video/mp4">
To get the best experience of this website please consider updating your web browser
</video>
you can simply add the "playsinline" attribute in the video tag, you may also include "webkit-playsinline"

Video doesn't play on site but it does somewhere else

I'm working on a website with a HTML5 video tag. The video doesn't play on the website. But if I test it somewhere else, it plays without a problem.
http://carflow-staging.houston-1.hybridmedia.be/
My code is here:
<video class="video-splash__video" width="720" height="405" autoplay="" poster="http://carflow-staging.houston-1.hybridmedia.be/wp-content/themes/framework_wp/img/videoCarflowBackground.png">
<source src="http://carflow-staging.houston-1.hybridmedia.be/wp-content/themes/framework_wp/video/videoCarflowBackground.mp4" type="video/mp4">
<source src="http://carflow-staging.houston-1.hybridmedia.be/wp-content/themes/framework_wp/video/videoCarflowBackground.ogg" type="video/ogg">
<source src="http://carflow-staging.houston-1.hybridmedia.be/wp-content/themes/framework_wp/video/videoCarflowBackground.webm" type="video/webm">
Your browser does not support the video tag or the file format of this video.
</video>
What could be the issue?

Why won't chrome play .mp4 or .webm?

Chrome says "This plugin isn't supported" even though I have both video formats. Strangely I can play HTML5 video on other websites (with the same computer/browser). I looked at the source and they have mp4 first then webm.
I tested the site with chrome from another computer and it works fine. Chrome is at the latest version on both computers.
Here is my code:
<video preload="auto" autoplay loop>
<source src="video/ssweb.mp4" type="video/mp4"/>
<source src="video/ssweb.webm" type="video/webm"/>
</video>
<video preload="auto" autoplay loop muted>
<source src="video/ssweb.mp4" type="video/mp4"/>
<source src="video/ssweb.webm" type="video/webm"/>
</video>
Add the muted attribute to the <video> tag.
As you explain your issue...Please check with your 'Chrome extension' in setting, it might be possible that you have any extension which is creating problem in playing the video.
Please try to stop all extensions and then try to run the page again. Hope it will work.

How can I play HDS vod stream using html5 video tag

I am using following code to play manifest.f4m vod stream through wowza media server.but it is not working Please help if anybody knows.
<video width="320" height="240" controls>
<source src="http://localhost:1935/vod/_definst_/mainVideo/smil:mainVideo.smil/manifest.f4m" type="video/mp4">
Your browser does not support the video tag.
</video>
As of this time, HTML5 does not support raw f4m. Consider converting the video file to a compatible format.
<video width="320" height="240" controls>
<source src="http://localhost:1935/vod/_definst_/mainVideo/smil:mainVideo.smil/manifest.f4m" type="video/f4m">
Your browser does not support the video tag.
</video>
try this code...