Is there a way to default the source of the HTML5 video? - javascript

I currently want to default the source of the video player to use the webm format. From my understanding of the video player, browsers play the first recognizable format they come across so I have the webm as the first source but it still uses the mp4 format. Is there a way to set a default source for the browser?
<video controls>
<source src="videofile.webm" />
<source src="videofile.mp4" />
<source src="videofile.ogv" />
</video>

Related

How to fix no sound issue for mkv video in reactjs

I have a video file in MKV format, i want to play that file in the browser without converting, how can i play this file format in browser?
<video width="320" height="240" controls>
<source src="movie.mkv" type="video/mkv" />
Your browser does not support the video tag.
</video>
when I use this, I can't hear sound.
I can see issue for .mkv format video.
.mp4 format is fine.
who can help me about this issue?

Won't stop download music on localhost on the embed element of audio

I almost made it so I can have background music but when I go to my localhost it just downloads the music instead of playing it but in the full path one it plays it in the background so how can I prevent this from happening so it won't download in localhost?
Here is the code for it and the file name is actually "Sound.mp3" as well.
<embed src="Sound.mp3" autostart="true" loop="true"width="2" height="0" controls>
Any ideas of what do add to make it just play and not download?
I am actually working on a page that looks pretty cool and wanted to add background music cause it is actually an "under construction" page and wanted to make it look cooler with background music.
The prefered way of adding audio in Html5 is to use the audio element.You can achieve them by using the following codes,
This code will play the Sound.mp3 file with the controllers displayed for the user. So the users can control the background music. With the autoplay attribute, the music will start automatically.
<audio controls="controls" autoplay="autoplay"><source src="Sound.mp3" type="audio/mpeg" /></audio>
If you don't wanna show the controls, you can simply remove the controls attribute. As follows,
<audio autoplay="autoplay"><source src="Sound.mp3" type="audio/mpeg" /></audio>
But the song will autoplay because the autoplay attribute is added.
Unfortunately, not all browsers support mp3, so it's a good idea to include multiple versions of the file in different formats. As follows,
<audio autoplay="autoplay">
<source src="Sound.mp3" type="audio/mpeg" />
<source src="Sound.wav" type="audio/wav" />
<source src="Sound.ogg" type="audio/ogg" />
<p>This content is displayed by browsers that don't recognize the audio element.</p>
</audio>
Hope it helped. Good luck with your project. :)
More Attributes
loop - Automatically loop (keep playing over and over).
Use Tag to attach the attach the audio file to the html file.
If your audio file is Sound.mp3 then include it in <audio> tag.
<audio controls>
<source src="Sound.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
or use the below code
<audio src="Sound.mp3"> </audio>

Playing videos one after another in html5 video player

I want to play a video after another video so I use this code
<video id="example_video_1" autoplay controls="none" width="640" height="300" poster="vlcsnap-2015-01-10-20h41m11s114.png" onended="run()">
<source src="intro.mp4" type='video/mp4' />
<source src="intro.webm" type='video/webm' />
<source src="intro.ogv" type='video/ogg' />
<p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video</p>
</video>
<script>
videoPlayer = document.getElementById("example_video_1");
function run(){
var nextVideo = "video2.mp4";
videoPlayer.src = nextVideo;
videoPlayer.play=autoplay;
videoPlayer.controls=controls;
};
</script>
This works fine in chrome but when i play this in firefox the 2nd video (video2.mp4) dose not play, as firefox dose not support mp4 format. So is there any process to set the second video in mp4, webm and ogg file format so that most of browsers can play the video.
Your last source <source src="intro.ogv" type='video/ogg' /> Is wrong. You wrote two different formats .ogg is for audio. And you need to establish a folder name that the file is in. With this you need to have the HTML5/CSS3 file right next to the folder in a separate folder. This is the correct code:
<source src="foldername/intro.ogv" type='video/ogv' />
Other than that your code is in great shape.
***I do not know anything about your script because I know nothing about JavaScript, or JQuery. Hopefully this was useful! Sorry :(

In what language is media players in websites written

So videos is used a lot in websites
you can put a video into your website using this html code
<video width="320" height="240" controls>
<source src="movie.mp4" type="video/mp4">
<source src="movie.ogg" type="video/ogg">
Your browser does not support the video tag.
</video>
But the media player that will appear is different from the media player in youtube.com (for example)
My question is how do i write a media player for my website?
The native controls vary from browser to browser. YouTube does not use the native controls, it uses a custom set of controls that tell the video to do things like play, pause, set volume etc..
Sites like Youtube use Flash. The ones built into the browsers (non-Flash) are likely C or C++. Maybe some Objective C in Safari.

How to play any format of media file in the Microsoft's SMF HTML5 Player

The HTML5 media player of SMF Framework has just a few media codecs like ogg vorbis, and mp4, so is there any way to play a media file of say, flv format or mkv or mp3 format?
And also, is there any way with which we can play local media files if the above case is satisfied?
Because of the browser support of video codecs in HTML5 Video, you can use only a few codecs in those. Also not all browsers support all video codecs. So you have to provide one H264 video in the mp4 Container (IE, Safari, Chrome) and a Ogg Theora video. You can transcode your Videos with a lot of free desktop tools like this one. You have to provide the different files like that:
<video id="myVideo" class="pf-video" width="480" height="320" controls="controls" poster="../media/bigbuck.png">
<source src="../media/bigbuck.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' />
<source src="../media/bigbuck.ogv" type='video/ogg; codecs="theora, vorbis"' />
</video>
Hope I could help you.

Categories

Resources