![function(){
var
sheet, bool,
head = docHead || docElement,
style = document.createElement("style"),
impl = document.implementation || { hasFeature: function() { return false; } };
style.type = 'text/css';
head.insertBefore(style, head.firstChild);
sheet = style.sheet || style.styleSheet;
var supportAtRule = impl.hasFeature('CSS2', '') ?
function(rule) {
if (!(sheet && rule)) return false;
var result = false;
try {
sheet.insertRule(rule, 0);
result = (/src/i).test(sheet.cssRules[0].cssText);
sheet.deleteRule(sheet.cssRules.length - 1);
} catch(e) { }
return result;
}:
function(rule) {
if (!(sheet && rule)) return false;
sheet.cssText = rule;
return sheet.cssText.length !== 0 && (/src/i).test(sheet.cssText) &&
sheet.cssText
.replace(/r+|n+/g, '')
.indexOf(rule.split(' ')[0]) === 0;
};
bool = supportAtRule('@font-face { font-family: "font"; src: url(data:,); }');
head.removeChild(style);
return bool;
};](https://image.slidesharecdn.com/rajashekaranvengalilbuildingcrossbrowserhtml5websites-111215020920-phpapp01/85/Rajashekaran-vengalil-building-cross-browser-html5-websites-13-320.jpg)
Rajashekaran vengalil building cross browser html5 websites
- 4. 12.09% IE8 3.12% 3.04% Chrome 14 29.00% FF 7 5.41% IE9 IE6 5.56% FF3.6 IE7 7.50% 13.65% FF6 Safari 5.1 9.79% Others 10.18% Source: http://www.netmarketshare.com/
- 9. // If not IE then use addEventListener¡
- 13. function(){ var sheet, bool, head = docHead || docElement, style = document.createElement("style"), impl = document.implementation || { hasFeature: function() { return false; } }; style.type = 'text/css'; head.insertBefore(style, head.firstChild); sheet = style.sheet || style.styleSheet; var supportAtRule = impl.hasFeature('CSS2', '') ? function(rule) { if (!(sheet && rule)) return false; var result = false; try { sheet.insertRule(rule, 0); result = (/src/i).test(sheet.cssRules[0].cssText); sheet.deleteRule(sheet.cssRules.length - 1); } catch(e) { } return result; }: function(rule) { if (!(sheet && rule)) return false; sheet.cssText = rule; return sheet.cssText.length !== 0 && (/src/i).test(sheet.cssText) && sheet.cssText .replace(/r+|n+/g, '') .indexOf(rule.split(' ')[0]) === 0; }; bool = supportAtRule('@font-face { font-family: "font"; src: url(data:,); }'); head.removeChild(style); return bool; };
- 25. <object type="application/x-silverlight-2" width="640" height="384"> <param name="source" value="http://channel9.msdn.com/App_Themes/default/VideoPlayer10_01_1 8.xap"></param> <param name="initParams" value="deferredLoad=true,duration=0,m=http://mysite.com/videos/big_buck_ bunny.mp4,autostart=true,autohide=true,showembed=true"></param> <param name="background" value="#00FFFFFF"></param> <a href="http://go.microsoft.com/fwlink/?LinkID=124807" style="text- decoration: none;"> <img src=/slideshow/rajashekaran-vengalil-building-cross-browser-html5-websites/10598927/"http:/go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight" style="border-style: none"/> </a> <param name="x-allowscriptaccess" value="never"></param> <param name="allowScriptAccess" value="never" /> <param name="wmode" value="opaque" /> </object>
- 26. <video controls width="500"> <source src=/slideshow/rajashekaran-vengalil-building-cross-browser-html5-websites/10598927/"video.mp4¡° type="video/mp4" /> </video>
- 28. <video controls width="500"> <source src=/slideshow/rajashekaran-vengalil-building-cross-browser-html5-websites/10598927/"video.mp4" type="video/mp4¡° /> <source src="video.ogg" type="video/ogg¡° /> <source src="video.webm" type="video/webm¡° /> </video>
- 30. <video controls width="500"> <source src=/slideshow/rajashekaran-vengalil-building-cross-browser-html5-websites/10598927/"video.mp4" type="video/mp4¡° /> <object type="application/x-silverlight-2¡° width="640" height="384"> ¡ more stuff here ¡ </object> </video>
- 32. blogorama.nerdworks.in rajave@microsoft.com @avranju
Editor's Notes
- #10: Don¡¯t do this because when IE starts supporting the standards compliant ¡°addEventListener¡± this code will continue to use ¡°attachEvent¡± which can potentially get deprecated.