I have a HTML5 video, working fine, and i'm happily smiling whenever i start my browser... However!
I know the Video tag isnt supported by some browsers, but i noticed there is a difference in support for video attributes/methods/whatever too. Is there a summary of this somewhere?
For example:
The poster attribute doesnt work in every browser, even if the vide DOES work!
I think its pretty worthless to just use an entire javascript library to take care of one attribute like poster, so how to take care of this?
Or am i completely wrong, and is IF video is supported, also every attribute supported the same way?
Please help me! :)
Thanks for all your advice,
WK
ps: I am using the video for everybody variant of the video. So thats working fine.
Is this the kind of thing your after?? click me.
Basically there is the following support for the HTML5 video tag:
Every modern browser that has support for HTML 5 supports <video>
meaning: IE9+, FF3.6+, Chrome, Opera, Safari
Internet Explorer 9 does not support the poster attribute. I believe
there is even a bug about this on Microsoft connect.
Firefox does not support the loop attribute. (replaying a video after it has finished)
Different browsers support different video formats, IE9 supports
H.264, Firefox supports ogg (Theora) and WebM etc, which means that you would need to provide all formats in order to be compatible with all browsers.
The rest is pretty much supported everywhere.
well, HTML 5 is not yet standardized. Due to this, every browser that support html5 works differently. As far video tag is concerned then you have to provide with different formats so as to get support on various browser list. You can test browser support on this site. Here you can get all the details about the extent your browser support to HTML5
I find this page a good resource (although it is starting to get old as it was earlier this year): http://www.longtailvideo.com/html5
On a separate note, I find if you go to mobile devices such as Android the browser support varies greatly per device. Even though they are "supported" I always get strange behavior.
As for poster, there is no good solution if you want to have support across all browsers.
Related
My company's website embeds videos, currently hosted on youtube. But due to the fact that as of recently, youtube inserts a channel icon into the embed, I will be moving the videos to either another platform, or will use HTML5 video.
I'm not crazy about one aspect or another of various platforms, except a very expensive one (Wistia).
So I'm looking into HTML5, and have a couple of questions. First, in almost 2019, would I still need multiple formats? The audience is non-technical, largely upscale, and would likely be using Chrome, IE, Firefox, Sarafi or Edge.
This has been asked before, but nowadays do you think I'm safe using only MP4? And if so, any thoughts about ongoing browser support for H.264?
Thanks! Steve
Use HTML5.
<video> tag is supported in all major browsers and it looks like MP4 is supported as well. (check it out here)
I'm having a problem playing audio in Safari or Opera. The following code does not work in either:
<audio controls>
<source src="http://fallowproduction.com/music/Paradigm%20E%20-%20Once%20upon%20a%20Dubstep2.mp3" type="audio/mpeg">
</audio>
Here's the jsFiddle for easy access to the code: http://jsfiddle.net/panq7/1/
Considering it's really simple, I'm mystified as to why. Is this a normal problem? Or is there something else going on? I looked up playing mp3 problems with Safari and while I found no solution, I found a bunch of complaints.
Edit: I fixed the Safari problem by adding an option for an embed tag. Still, it's not the ideal fix, as Safari is supposed to support the <audio> tag, which it does not, apparently (someone let me know if it works in their version of Safari). However, Opera apparently does not support the <audio> tag, or the <embed> tag. This is contrary to the browser specifications, as mentioned later by another member of StackOverflow.
Opera does support <audio> however, when using MP3, there seems to be limited support for different sampling rates. To solve this problem, I detect support for OGG and detect the Opera browser and fall back to OGG. It's not perfect because I would prefer to simply detect if there is MP3 support and go with that, however Opera reports that it does support MP3, so it's not enough to just check that.
You could also simply use supported MP3 formats for Opera. I believe the following is supported:
32kHz/44.1kHz/48kHz frequencies,
16kbps-10Mbps bitrate
The reason may be the missing closed tag /> in source line.
Wolfgang
I had a solution to show both .MP4 and .WMV embedded in the browser. It worked fine in both IE and Chrome, but for some time ago it stopped working in Chrome. Chrome will not show any files (mp4 or wmv), but it works fine in IE. I googled it, and found several reasons to why Chromes newer version couldn't deal with this, but no solution to my problem.
The solution that worked was <object><embed>, but this only works in IE now. Then I tried to add the <video> tag and got it to work with mp4 in Chrome, but not with wmv.
So, is it anyone that have a solution to embed a wmv file that will run without problems in Chrome?
The requirements is that it should be able to play both MP4 and WMV files in Chrome and IE.
The long and short of it is that there is no solution. The <video> tag is supported by almost all browsers now, but there are different levels of support for different formats:
MP4 - Good support (noone uses Opera anyway). Works with both the browsers you mentioned.
WebM - Patchy support, definitely none on IE for the time being
WMV - I can't even find anyone giving a hard answer on this one, but I think the general concensus is that <video> is the way to go, and that to use one of the two above formats is the way to go. MP4 seems the better choice for the time being. If there are requirements to say that you must achieve the impossible/pointless, I'd suggest that your requirements-setters familiarise themselves with ffmpeg :)
I would like to use html5 video on our site but wanted to find out if there is any way of adding support for IE6 seeing that some of our clients use old browsers. I am not sure if I inherit the js "modernizr.js" whether this will solve my issue. Please advise or may you please suggest an alternative besides flash?
Straight answer? You simply can't use HTML5 video in old IE.
You'd be best using a jQuery solution. There's a great plugin which handles all this leg-work for you called jPlayer:
http://www.jplayer.org/
Check it out.
As already suggested in the comment above, you should utilize some kind of fallback to Flash and/or Silverlight for browsers non capable of HTML5 video.
For example have a look at mediaelementjs, which is working well and has support for IE 6. There's also a chart on their website indicating which technology is used in which browser.
I want to create a webPage using HTML 5 which will use all the attractive features of HTML5 i.e. audio, video, autofocus, placeholder, required, email, url, number etc. and the webPage should also have support for the browsers which dont support HTML5 like IE or some versions of other popular browsers such as Chrome, Firefox, opera etc.
How do I start working on that, as You might guess that this is just for the experimental purpose and I am supposed to it asap... so please suggest me any help, site or blog or tutorial or example.. I have seen hhtml5Doctor.com and diveintohtml5.ep.io ... the sites are of great help...
Use progressive enhancement. The diveintohtml5 already tells you how: http://diveintohtml5.ep.io/detect.html
html5boilerplate is a good start, it includes modernizr/html5shiv for barebones support of the new elements.
Other things may need javascript/flash fallbacks.
You can make use of the fact that browsers will ignore tag that they don't understand. So, for example, you can have an audio tag and inside that put an object tag for a flash audio player. The HTML5 browser will understand the audio tag and do the right thing, and ignore the child content. An older browser will see the audio tag and throw it away beacuse it doesn't understand it, but will render the child contents of the tag instead (the flash player).
swfobject and Modernizer are really nice tools... u must give them a try... I would personally recommend swfObject due to very good support.