HTML5 Video Tag for .mov - html

I´m incorporating a video code in my project, but it doesn´t seem to work correctly. So I´ve made a very basic, simple page to test the code in order to see if I´m doing anything wrong.
Here´s the link:
http://swingostoso.com.br.temp-address.com/pt/TesteVideo01.html
The only thing that´s different on this code is that I´m trying to stream a .mov video file. Other formats work fine with a similar code. But not this onde.
Thanks,

You have correctly identified that the problem is the use of the mov file.
According to MDN's Media formats supported by the HTML audio and video elements, only Safari supports the Quicktime video format.
The solution is to use a supported video format.

Related

Integrating video.js with Angular7

I want to use videojs to render a HLS stream on my webpage.Stream is working well on vlc while on browser using videojs it plays the stream but doesnt seem to load completely.All implicit features of videojs player appear in raw HTML form.
Below is the screenshot of how it shows just below the playing video.
I could have posted the code snippets but i dont know which file should I post.I thought someone could guess where the problem is occurring.Please help I am frustrated by this.

How can I embed the new GIFV format on my webpage?

Normally I would embed a gif like so.
<img src="http://i.imgur.com/awHPuBp.gifv">
Although I get an error that the image could not be loaded.
I'm just wondering what mark up I will need to use so that I can display the GIFV.
GIFV is created by imgur and more information can be found here.
I just checked that demo site. It seems that they just convert the video to a webm video (in case of Firefox). Check this file here which comes from the demo: http://i.imgur.com/A61SaA1.webm
So I would say you could also just use the <video> tag to embedd those "gif" files. I just guess that use a feature detection and a video converting logic. No idea what this nonsense should be for.

Best way of posting a video to a html website

I want to post some mp4 videos in my site and I don't want to upload it to youtube or any 3rd party web app which will let me embed it into my website. I also don't want to use any blogging system like wordpress, drupal. So then what is the best way to post it to my site so that most devices will be able to view it. And can I customize the player which I use?
I have seen w3schools html5 video but I didn't find it helpful. I have also seen ' Video onto a website without plugins ' but I am not satisfied with that.
[Hint: I am ready to convert my video into any format required.]
Thanks in advance.
I have used video.js for this purpose, it worked for me. I haven't tried editing it much, but it has options.
http://www.videojs.com
Use the HTML 5 video element. You'll have to upload your video in different formats, since there is no video format that is supported by all browsers, but support for the video element itself is quite good. IE8 doesn't support it, but IE8 is already very old. With the video tag you don't need Javascript or flash plugins.
For an overview of browser support see CanIUse. Another source with much detailed information about video formats and how to convert them is DiveIntoHTML5.info.

Embedded webm video freezes in Chrome

I am making a system that I run on localhost, it embeds a video player and all works fine except for webm videos on Chrome. They freeze regularly and I can only get them running again by pressing play/pause and moving to the initial phases of the video.
I have been googling for this issue and trying to solve it for some time now without success, does anybody know how to solve this?
Is your same WebM file working ok on Firefox? I assume you are using HTML5 video.
I have compiled a short check list on how to troubleshoot HTML5 video playback issue here. Try to play the videojs webm sample to see if it works.
Given the description of your issue I guess it is either a non proper WebM file or a server side tuning issue (like with mime types).
If it is a file format issue you could try re-transcoding from a known good source (ie not the problematic WebM file) with firefogg.
You can also try to set the preload attribute of your HTML5 video tag to auto.

html5 audio and WebAudio are BFFs - are they?

i am coding on a custom player for quite a while now.
My plan was to use soundcloud as my backend. And the HTML5 audio Tag as my streaming object.
I also want to include a Canvas for a bit of visualisation. And thats were the problem starts.
For the Visuals to work on both Browsers, I need to load the audio into an arraybuffer via xhr request. But then I can't use the audio Tag anymore. Which is sad, because by now I know how to code all the functionality i need based on it.
I found the article on html5rocks about html5 audio and WebAudio being best friends.
There is also an example on how to use the tag with an frequency bar visualizer. BUT
this only works on Chrome, because Firefox - maybe some of you have noticed - will play .mp3 files but inside a video object. For the visuals to work I would need .ogg files for Firefox. But then i can't use soundcloud as my backend anymore.
So do i have to rethink the whole player - or is there a way to decode the audio on both browsers while using html 5 audio?
thank you very much.
That's an issue with FF (no MP3 support in <audio>). But can't you get a media stream from the element also? It shouldn't matter that it's a not an - audioContext.createMediaElementSource should work on that, too.