Kalyani_- _HTML5_on_ASPNET

Views:
 
Category: Entertainment
     
 

Presentation Description

No description available.

Comments

Presentation Transcript

Backwards Compatible HTML5/CSS3 Apps in ASP.NET : 

Backwards Compatible HTML5/CSS3 Apps in ASP.NET Nik Kalyani, Founder/CEO, HyperCrunch, Inc.

Slide 2: 

Nik Kalyani Definiti, Inc.(Technology Services) iWidgets, Inc.(Venture Funded DotCom) DotNetNuke Corp.(Venture Funded O/S CMS) HyperCrunch, Inc.(Stealth Mode) Award Recognition:Microsoft MVP ASP.NET Co-founded Sold Founded Folded Co-founded Founded CALIFORNIA me my company my hometown stuff I did

Agenda : 

Agenda Highlights: HTML5 and CSS3 Code Q and A

Highlights: HTML5 & CSS3 : 

Highlights: HTML5 & CSS3

Overview : 

Overview HTML 5 Specifically designed for web applications Nice to search engines and screen readers HTML 5 will update HTML 4.01, DOM Level 2 CSS level 3 Will make it easier to do complex designs Will look the same across all browsers CSS 3 will update CSS level 2 (CSS 2.1)

HTML5: New DocType : 

HTML5: New DocType <!DOCTYPE html> Works now in all browsers for “standards mode” start using it!

Structural Elements : 

Structural Elements <header> <nav> <article> <aside> <section> <footer> <summary> <details>

HTML5: Audio & Video : 

HTML5: Audio & Video Native Audio Element <audio> <source src="music.oga" type="audio/ogg"> <source src="music.mp3" type="audio/mpeg"> </audio> Native Video Element <video src="video.ogv" controls poster="poster.jpg"> <a href="video.ogv">Download movie</a> </video>

HTML5: Canvas - 2D Drawing : 

HTML5: Canvas - 2D Drawing function draw() { var ctx = document.getElementById('canvas').getContext('2d'); var img = new Image(); img.onload = function(){ ctx.drawImage(img,0,0); ctx.beginPath(); ctx.moveTo(30,96); ctx.lineTo(70,66); ctx.lineTo(103,76); ctx.lineTo(170,15); ctx.stroke(); } img.src = 'images/backdrop.png'; }

HTML5: Form Elements : 

HTML5: Form Elements New Input Types tel, search, url, email, datetime, date, month, week, time, datetime-local, number, range, color New Elements <datalist> <meter> <progress> <output>

HTML5: DOM APIs : 

HTML5: DOM APIs Geo-location Structured Client-side Storage Cross-document Messaging Drag and Drop

CSS3 : 

CSS3 Attributes opacity, rgb, hsla background-size, background-image border-color, border-image, border-radius, box-shadow text-overflow, text-shadow, column-width, column-gap

CodeDownload: http://www.kalyani.com : 

CodeDownload: http://www.kalyani.com

Resources : 

Resources http://html5doctor.com/ http://www.html5test.com/ My Blog: http://www.kalyani.com

authorStream Live Help