Skip to content
May 2, 2013 / Mohamed Amged :)

IE HTML5 Fallbacks (HTML5 on IE6,7,8)

Image

IE HTML5 Fallbacks

Well, I’m gonna getting the subject directly. IE is the worst thing a human being made ever over the time, especially the older versions 6,7&8. HTML5 is so cool but usefulness when you getting to adapt your site with the crappy older ie versions. I found few tools so that can handle these fallbacks, although the performance is gonna effected in an obvious way, but it’s quite solution for this problem to provide a unique user experience over the deffrent platforms and for all users. I’m really humbled to found those amazing tools.
The best tools for IE HTML5 fallbacks:
1. Video
mediaelement.js by John Dyer
swf player that mimics HTML5 media API. Consistent UI across browsers and flash. <track> support. http://mediaelementjs.com/
SublimeVideo
Amazing video player provided as a service, adapt the player according to the browser and device http://sublimevideo.net/
2. Audio
jPlayer
Beautiful UI, stable performance and easy to develop http://github.com/happyworm/jPlayer
SoundManager2
Great solution for multiple user experience apps and great solution, they are really doing great job!! http://www.schillmania.com/projects/soundmanager2/
The idea of audio/video fallbacks is, there is no way to add video/audio to ie nether by vml or js or any thing, there is a small js code for detecting the browser if it’s older than ie9 it loads flash video/audio player and add the file url to play

3. Web Forms
input placeholder
Placeholders.js
(non-jQuery, works in IE6+, and also now allows for placeholders that don’t disappear on focus)
https://github.com/jamesallardice/Placeholders.js
4. Web Sockets
Portal
Server agnostic and supports Sharing connection, WebSocket, Server-Sent Events, Streaming and Long polling. https://github.com/flowersinthesand/portal
DataChannel polyfill
Add support for WebRTC DataChannels using a WebSockets proxy server as backend https://github.com/piranna/DataChannel-polyfill
5. Geo-Location
geo-location-javascript
Mobile-centric: non-standard blackberry and webOS tricks. http://code.google.com/p/geo-location-javascript/
6. Application Cache
html5-gears
for HTML 5’s offline API and manifest format, implemented using Google Gears under the cover. http://code.google.com/p/html5-gears/
7. HTML5 History API
HTML5-History-API
lightweight and fully standardize compliant implementation of History API with IE6+ support and hashchange implementation. https://github.com/devote/HTML5-History-API
8. Mark-ups
<details> and <summary>
Pure JS polyfill with DOM API and IE6+ support https://github.com/termi/Element.details
<meter>
JQuery-meter-shim https://github.com/xjamundx/HTML5-Meter-Shim
<output>, <progress>, <menu>, <command>, <keygen>
https://github.com/LeaVerou/HTML5-Progress-polyfill
https://github.com/medialize/jQuery-contextMenu
<datalist>
Webshims Lib
has support for datalist-element (includes input[list], input[selectedOption], datalist[options]) by Alexander Farkas http://afarkas.github.com/webshim/demos/
<ol reversed>
Polyfill for ‘reversed’ attribute on ordered lists by Louis Lazaris. Also integrates with the ‘start’ attribute, which has 100% browser support.
https://github.com/impressivewebs/HTML5-Reverse-Ordered-Lists
<style scoped>
Scoped Styles
jQuery Plugin to enable the scoped attribute on style blocks so they only affect their parent element’s children http://github.com/thingsinjars/jQuery-Scoped-CSS-plugin
9. File API
Multiupload: all browsers that support HTML5 or Flash
Drag’n’Drop upload: files (HTML5) & directories (Chrome 21+)
Upload one file: all browsers
Working with Images: IE6+, FF 3.6+, Chrome 10+, Opera 11.1+, Safari 5.4+ https://github.com/mailru/FileAPI
10. WebGL
IEWebGL http://iewebgl.com/
11. DOM
Flow.js
Flow implements DOM3 in IE6 http://flowjs.com/
12. CSS3
Selectors

selectivizr http://selectivizr.com/

TO BE CONTINUE..

Advertisements

Please, Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: