SlideShare une entreprise Scribd logo
1  sur  35
bit.ly/avranju
4.48%   3.45%



   6.90%                                   IE8
                        25.40%
                                           IE9
7.79%
                                           Chrome 17
                                           Others
                                           FF 10
22.08%                   15.17%            IE6
                                           IE7
                                           Safari 5.1
               14.73%


                                  Source: http://www.netmarketshare.com/
// If not IE then use addEventListener…
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;
  };
if(Modernizr.fontface){
…
}
http://bit.ly/polyfills
<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="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>
<video controls width="500">
     <source src="video.mp4“ type="video/mp4" />
</video>
Credit: Encoding.com
<video controls width="500">
  <source src="video.mp4" type="video/mp4“ />
  <source src="video.ogg" type="video/ogg“ />
  <source src="video.webm" type="video/webm“ />
</video>
<video controls width="500">
  <source src="video.mp4" type="video/mp4“ />
     <object type="application/x-silverlight-2“
              width="640" height="384">
         … more stuff here …
      </object>
</video>
blogorama.nerdworks.in
rajave@microsoft.com
   @avranju
Best practices for building cross browser compatible web apps

Contenu connexe

Tendances

jAPS 2 0 - Presentation Layer Comparison
jAPS 2 0 - Presentation Layer ComparisonjAPS 2 0 - Presentation Layer Comparison
jAPS 2 0 - Presentation Layer ComparisonWilliam Ghelfi
 
jQtouch, Building Awesome Webapps
jQtouch, Building Awesome WebappsjQtouch, Building Awesome Webapps
jQtouch, Building Awesome WebappsHome
 
FrontInBahia 2014: 10 dicas de desempenho para apps mobile híbridas
FrontInBahia 2014: 10 dicas de desempenho para apps mobile híbridasFrontInBahia 2014: 10 dicas de desempenho para apps mobile híbridas
FrontInBahia 2014: 10 dicas de desempenho para apps mobile híbridasLoiane Groner
 
Short lived immutable servers with masterless puppet
Short lived immutable servers with masterless puppetShort lived immutable servers with masterless puppet
Short lived immutable servers with masterless puppetNeil Millard
 

Tendances (6)

Send.php
Send.phpSend.php
Send.php
 
jAPS 2 0 - Presentation Layer Comparison
jAPS 2 0 - Presentation Layer ComparisonjAPS 2 0 - Presentation Layer Comparison
jAPS 2 0 - Presentation Layer Comparison
 
jQtouch, Building Awesome Webapps
jQtouch, Building Awesome WebappsjQtouch, Building Awesome Webapps
jQtouch, Building Awesome Webapps
 
Show messagehello
Show messagehelloShow messagehello
Show messagehello
 
FrontInBahia 2014: 10 dicas de desempenho para apps mobile híbridas
FrontInBahia 2014: 10 dicas de desempenho para apps mobile híbridasFrontInBahia 2014: 10 dicas de desempenho para apps mobile híbridas
FrontInBahia 2014: 10 dicas de desempenho para apps mobile híbridas
 
Short lived immutable servers with masterless puppet
Short lived immutable servers with masterless puppetShort lived immutable servers with masterless puppet
Short lived immutable servers with masterless puppet
 

En vedette

Rendering in browser
Rendering in browserRendering in browser
Rendering in browserPu Shiming
 
I heart the open web
I heart the open webI heart the open web
I heart the open webMark Surman
 
Web Compatibility and Performance Testing in a Multi-Browser World
Web Compatibility and Performance Testing in a Multi-Browser WorldWeb Compatibility and Performance Testing in a Multi-Browser World
Web Compatibility and Performance Testing in a Multi-Browser WorldCompuware APM
 
走在前面,看見世界的設計
走在前面,看見世界的設計走在前面,看見世界的設計
走在前面,看見世界的設計DesBear Li
 
Best Practices For Delivering Quality Web Experiences In A Mobile, Multi-Brow...
Best Practices For Delivering Quality Web Experiences In A Mobile, Multi-Brow...Best Practices For Delivering Quality Web Experiences In A Mobile, Multi-Brow...
Best Practices For Delivering Quality Web Experiences In A Mobile, Multi-Brow...Compuware APM
 
Cross browser web development
Cross browser web developmentCross browser web development
Cross browser web developmentIlya Starostin
 
Enable seo friendly url in websphere portal
Enable seo friendly url in websphere portalEnable seo friendly url in websphere portal
Enable seo friendly url in websphere portalmichele buccarello
 
Wmq wmb dist migration v1 030310
Wmq wmb dist migration v1 030310Wmq wmb dist migration v1 030310
Wmq wmb dist migration v1 030310karthickmsit
 
Cross-Browser Compatibility, and a little bit about Page Load, too.
Cross-Browser Compatibility, and a little bit about Page Load, too.Cross-Browser Compatibility, and a little bit about Page Load, too.
Cross-Browser Compatibility, and a little bit about Page Load, too.Chad Carstensen
 
Continuous Integration (Jenkins/Hudson)
Continuous Integration (Jenkins/Hudson)Continuous Integration (Jenkins/Hudson)
Continuous Integration (Jenkins/Hudson)Dennys Hsieh
 

En vedette (10)

Rendering in browser
Rendering in browserRendering in browser
Rendering in browser
 
I heart the open web
I heart the open webI heart the open web
I heart the open web
 
Web Compatibility and Performance Testing in a Multi-Browser World
Web Compatibility and Performance Testing in a Multi-Browser WorldWeb Compatibility and Performance Testing in a Multi-Browser World
Web Compatibility and Performance Testing in a Multi-Browser World
 
走在前面,看見世界的設計
走在前面,看見世界的設計走在前面,看見世界的設計
走在前面,看見世界的設計
 
Best Practices For Delivering Quality Web Experiences In A Mobile, Multi-Brow...
Best Practices For Delivering Quality Web Experiences In A Mobile, Multi-Brow...Best Practices For Delivering Quality Web Experiences In A Mobile, Multi-Brow...
Best Practices For Delivering Quality Web Experiences In A Mobile, Multi-Brow...
 
Cross browser web development
Cross browser web developmentCross browser web development
Cross browser web development
 
Enable seo friendly url in websphere portal
Enable seo friendly url in websphere portalEnable seo friendly url in websphere portal
Enable seo friendly url in websphere portal
 
Wmq wmb dist migration v1 030310
Wmq wmb dist migration v1 030310Wmq wmb dist migration v1 030310
Wmq wmb dist migration v1 030310
 
Cross-Browser Compatibility, and a little bit about Page Load, too.
Cross-Browser Compatibility, and a little bit about Page Load, too.Cross-Browser Compatibility, and a little bit about Page Load, too.
Cross-Browser Compatibility, and a little bit about Page Load, too.
 
Continuous Integration (Jenkins/Hudson)
Continuous Integration (Jenkins/Hudson)Continuous Integration (Jenkins/Hudson)
Continuous Integration (Jenkins/Hudson)
 

Similaire à Best practices for building cross browser compatible web apps

Practical HTML5: Using It Today
Practical HTML5: Using It TodayPractical HTML5: Using It Today
Practical HTML5: Using It TodayDoris Chen
 
Summit2014 topic 0066 - 10 enhancements that require 10 lines of code
Summit2014 topic 0066 - 10 enhancements that require 10 lines of codeSummit2014 topic 0066 - 10 enhancements that require 10 lines of code
Summit2014 topic 0066 - 10 enhancements that require 10 lines of codeAngel Borroy López
 
Enhance Web Performance
Enhance Web PerformanceEnhance Web Performance
Enhance Web PerformanceAdam Lu
 
Javascript MVC & Backbone Tips & Tricks
Javascript MVC & Backbone Tips & TricksJavascript MVC & Backbone Tips & Tricks
Javascript MVC & Backbone Tips & TricksHjörtur Hilmarsson
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2fishwarter
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2fishwarter
 
Django Rest Framework and React and Redux, Oh My!
Django Rest Framework and React and Redux, Oh My!Django Rest Framework and React and Redux, Oh My!
Django Rest Framework and React and Redux, Oh My!Eric Palakovich Carr
 
Rajashekaran vengalil building cross browser html5 websites
Rajashekaran vengalil building cross browser html5 websitesRajashekaran vengalil building cross browser html5 websites
Rajashekaran vengalil building cross browser html5 websitesOpenSourceIndia
 
Rajashekaran vengalil building cross browser html5 websites
Rajashekaran vengalil building cross browser html5 websitesRajashekaran vengalil building cross browser html5 websites
Rajashekaran vengalil building cross browser html5 websitessuniltomar04
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2fishwarter
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2fishwarter
 
Introduction to Django
Introduction to DjangoIntroduction to Django
Introduction to DjangoJoaquim Rocha
 
The Django Web Application Framework
The Django Web Application FrameworkThe Django Web Application Framework
The Django Web Application FrameworkSimon Willison
 

Similaire à Best practices for building cross browser compatible web apps (20)

Practical HTML5: Using It Today
Practical HTML5: Using It TodayPractical HTML5: Using It Today
Practical HTML5: Using It Today
 
Summit2014 topic 0066 - 10 enhancements that require 10 lines of code
Summit2014 topic 0066 - 10 enhancements that require 10 lines of codeSummit2014 topic 0066 - 10 enhancements that require 10 lines of code
Summit2014 topic 0066 - 10 enhancements that require 10 lines of code
 
JSP
JSPJSP
JSP
 
Enhance Web Performance
Enhance Web PerformanceEnhance Web Performance
Enhance Web Performance
 
Javascript MVC & Backbone Tips & Tricks
Javascript MVC & Backbone Tips & TricksJavascript MVC & Backbone Tips & Tricks
Javascript MVC & Backbone Tips & Tricks
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2
 
Django Rest Framework and React and Redux, Oh My!
Django Rest Framework and React and Redux, Oh My!Django Rest Framework and React and Redux, Oh My!
Django Rest Framework and React and Redux, Oh My!
 
Rajashekaran vengalil building cross browser html5 websites
Rajashekaran vengalil building cross browser html5 websitesRajashekaran vengalil building cross browser html5 websites
Rajashekaran vengalil building cross browser html5 websites
 
Rajashekaran vengalil building cross browser html5 websites
Rajashekaran vengalil building cross browser html5 websitesRajashekaran vengalil building cross browser html5 websites
Rajashekaran vengalil building cross browser html5 websites
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2
 
The Django Web Application Framework 2
The Django Web Application Framework 2The Django Web Application Framework 2
The Django Web Application Framework 2
 
สปริงเฟรมเวิร์ค4.1
สปริงเฟรมเวิร์ค4.1สปริงเฟรมเวิร์ค4.1
สปริงเฟรมเวิร์ค4.1
 
Web-Performance
Web-PerformanceWeb-Performance
Web-Performance
 
Django Vs Rails
Django Vs RailsDjango Vs Rails
Django Vs Rails
 
Php frameworks
Php frameworksPhp frameworks
Php frameworks
 
Introduction to Django
Introduction to DjangoIntroduction to Django
Introduction to Django
 
The Django Web Application Framework
The Django Web Application FrameworkThe Django Web Application Framework
The Django Web Application Framework
 
JSConf US 2010
JSConf US 2010JSConf US 2010
JSConf US 2010
 
Assetic (Zendcon)
Assetic (Zendcon)Assetic (Zendcon)
Assetic (Zendcon)
 

Dernier

2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusZilliz
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAndrey Devyatkin
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistandanishmna97
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoffsammart93
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Jeffrey Haguewood
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingEdi Saputra
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamUiPathCommunity
 
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Angeliki Cooney
 
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...apidays
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FMESafe Software
 
AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024The Digital Insurer
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfsudhanshuwaghmare1
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherRemote DBA Services
 
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Zilliz
 
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Orbitshub
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...DianaGray10
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FMESafe Software
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProduct Anonymous
 
Ransomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfRansomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfOverkill Security
 

Dernier (20)

2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
CNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In PakistanCNIC Information System with Pakdata Cf In Pakistan
CNIC Information System with Pakdata Cf In Pakistan
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 AmsterdamDEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
DEV meet-up UiPath Document Understanding May 7 2024 Amsterdam
 
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
Biography Of Angeliki Cooney | Senior Vice President Life Sciences | Albany, ...
 
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
Apidays New York 2024 - Passkeys: Developing APIs to enable passwordless auth...
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024
 
Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
 
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
Navigating the Deluge_ Dubai Floods and the Resilience of Dubai International...
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemkeProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
ProductAnonymous-April2024-WinProductDiscovery-MelissaKlemke
 
Ransomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdfRansomware_Q4_2023. The report. [EN].pdf
Ransomware_Q4_2023. The report. [EN].pdf
 

Best practices for building cross browser compatible web apps

  • 2.
  • 3.
  • 4. 4.48% 3.45% 6.90% IE8 25.40% IE9 7.79% Chrome 17 Others FF 10 22.08% 15.17% IE6 IE7 Safari 5.1 14.73% Source: http://www.netmarketshare.com/
  • 5.
  • 6.
  • 7.
  • 8.
  • 9. // If not IE then use addEventListener…
  • 10.
  • 11.
  • 12.
  • 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; };
  • 14.
  • 15.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 25.
  • 26.
  • 27. <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="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>
  • 28. <video controls width="500"> <source src="video.mp4“ type="video/mp4" /> </video>
  • 30. <video controls width="500"> <source src="video.mp4" type="video/mp4“ /> <source src="video.ogg" type="video/ogg“ /> <source src="video.webm" type="video/webm“ /> </video>
  • 31.
  • 32. <video controls width="500"> <source src="video.mp4" type="video/mp4“ /> <object type="application/x-silverlight-2“ width="640" height="384"> … more stuff here … </object> </video>
  • 33.

Notes de l'éditeur

  1. 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.