Windays 11 - IE9 i HTML5

Internet Explorer 9 i HTML5 Matija Šmalcelj Pet Minuta www.fiveminutes.eu Lead Developer, Mobile/Web

Sadržaj predavanja ,[object Object],[object Object],[object Object]

Windows Internet Explorer 9 2000 2005 2011 1995

Najvažnije novosti ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Standardi ,[object Object],[object Object]

Performanse ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Performanse ,[object Object],[object Object],[object Object],[object Object],[object Object]

DEMO ,[object Object],[object Object],[object Object]

Web stranice kao aplikacije ,[object Object],[object Object],application-name msapplication-tooltip msapplication-starturl msapplication-navbutton-color msapplication-window msapplication-task + favicon

Što je novo u HTML5? ,[object Object],[object Object],[object Object],[object Object],[object Object]

Drugi nadolazeći standardi ,[object Object],[object Object],[object Object],[object Object]

Sintaksa ,[object Object],[object Object],<! DOCTYPE html > < link rel ='stylesheet' href ='path/to/stylesheet.css' /> < script src ='path/to/script.js'></ script >

Sintaksa ,[object Object],[object Object],< p class =mojaKlasa id =mojId></ p > < P ClAsS =MojaKlasa id =MOJID></ P >

Naglasak na semantici < div id ='header'> ... </ div > < div id ='content'> < img src ='...' /> < p > Opis slike </ p > </ div > < div id ='sidebar'> ... </ div > < div id ='footer'> ... </ div > < header > ... </ header > < article > < figure > < img src =‘...’ /> < figcaption > Opis slike </ figcaption > </ figure > </ article > < aside > ... </ aside > < footer > ... </ footer >

data-... atributi ,[object Object],[object Object],< p id ='clanak' data-article-id ='12345' ></ p > // dohvat var clanak = document.getElementById( 'clanak' ); var id = clanak.dataset.articleId;

[object Object],[object Object],window.localStorage.setItem ( 'kljuc' , 'vrijednost' ); window.localStorage. getItem ( 'kljuc' ); window.localStorage. removeItem ( 'kljuc' ); window.localStorage. clear () Jednostavna pohrana podataka

Multimedija ,[object Object],[object Object],< audio controls autoplay loop preload > < source src ='file.ogg' /> < source src ='file.mp3' /> < a href ='file.mp3’> Preuzmi datoteku. </ a > </ audio > < video height width poster audio > < source src ='http://www.youtube.com/.../'> < p > HTML 5 video nije podrzan </ p > </ video >

Geolokacija ,[object Object],[object Object],navigator.geolocation.getCurrentPosition ( function (pos) { alert( pos.coords.latitude + ', ' + pos.coords.longitude ); }, function (err){ alert( 'Doslo je do greske: ' + err); });

CSS3 ,[object Object],[object Object],[object Object],[object Object],[object Object],box-shadow : ... -moz-box-shadow: ... -webkit-box-shadow: ... -o-box-shadow: ...

Trenutno stanje* * ne uključuje beta verzije Izvor: Wikipedia

Modernizr ,[object Object],< body class ='no-multiplebgs'> .multiplebgs div p { /* OK */ } .no-multiplebgs div p { /* nema podrske */ } if (Modernizr.localstorage) { // OK } else { // Nema podrske } http://www.modernizr.com/

Finalna specifikacija 2022 ? 10 godina 8 mjeseci 26 dana

Windays 11 - IE9 i HTML5

Recommended

Recommended

More Related Content

More from Matija Šmalcelj

More from Matija Šmalcelj (7)

Windays 11 - IE9 i HTML5