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 :)
Related
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 never thought, I'd have to ask THIS question:
Is there a cross-browser way to play background MIDI files in a website without the need for a plugin?
(Now, please don't answer with "don't do it! it's annoying as hell!". It's for a kids-page and they love this stuff... And I will give the option to turn it on or off...)
I've found several approaches, each with their own problems:
<bgsound ...>-tag: IE only; must be careful not to use with other tag that IE might interpret also
<embed ...>-tag: Doesn't work in Chrome. Firefox requires a plugin, which it can't even install automatically...
<object ...>-tag: Chrome and Firefox require a plugin. Both suggest QuickTime, but neither installs it correctly...
<audio ...>-tag: Requires HTML 5; also not sure if it supports MIDI across browsers...
use a Java applet: Not available everywhere, and seems like overkill
Is there some way to make this work across browsers (minimum: current Firefox, Chrome, Safari, Opera, IE6+, Android, iOS) without requiring any plugins? Probably some clever mix of all the tags listed above?
I am really surprised that this seems to be so difficult. Is MIDI deprecated? Or background-audio in websites in general?
Why not HTML 5 Audio. After all it is supported in all latest browsers. ( Firefox/Opera can have problem with H.264 files ). And in case of Mobile browsers it should more better choice.
One option you may want to pursue is SoundManager2. An audio project based on JavaScript. I use it in many of my web projects and so far it seems goood. Requires a little bit of a learning curve, but the API is very rich and clear and how to install it and use it for various situations.
http://www.schillmania.com/projects/soundmanager2/
By building a JavaScript package for audio within your web site, you won't have to worry about additional plug-ins that front-end users may need to have for their machines. It works with old and new browsers, MIDI files, MP3's and more.
I converted a video to webm through Any Video Converter and it plays fine in Firefox. However, in Chrome it constantly resizes itself during playback and I'm not sure why.
I previously used Miro converter, but that video wouldn't play in Firefox at all for some reason. It would jump instantly to the end of the video when I pressed play. When using my custom settings, it did the weird resizing thing in Chrome, but when I exported it again using the default settings, it played normally in Chrome, but still nothing in Firefox, so I switched to using Any Video Converter and now the resizing issue is back. I didn't change anything in the settings.
Here's the link:
http://kimkellermedia.com/videoTest.html
I'm using the latest versions of both Firefox and Chrome by the way.
I never quite figured out what was causing the rapid size change during playback, but this link recommended some converters I haven't tried yet. http://www.my-html-codes.com/html5-video-converters
I used Free WebM Encoder http://webmsoft.com/free-webm-encoder.html and everything works fine now on all browsers. So, if anyone else has seen this weird issue, use this converter I guess.
It would still be nice to know what caused everything in the first place, just in case it happens again, but at least everything is fine now! By the way, I've taken down the videoTest link I provided in the original question since I don't need it anymore.
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.
I'm trying to figure out which audio files are compatible with the <audio> tags across all the browsers. I've seen sites that state that some use .mp3, and some use .ogg, but somewhere else I saw that all supported .wav. But those sites were outdated.
Is there any up-to-date information on the current support for <audio> for all browsers across all platforms?
#animusion is wrong, Internet Explorer 9 does support the audio tag!
You only need two formats to cover all browsers today:
Ogg Vorbis (often .ogg): covers all browsers except IE and Safari, presumably because they hate the internet and don't want to support free formats.
AAC (often .m4a): covers Internet Explorer and Safari.
You should not use MP3.
This resource is pretty up to date : http://www.scirra.com/blog/44/on-html5-audio-formats-aac-and-ogg. Even MS has a new article on media tags, http://msdn.microsoft.com/en-us/magazine/hh781023.aspx