Modernizr
Ovaj članak je započet ili proširen kroz projekat seminarskih radova. Potrebno je proveriti prevod, pravopis i viki-sintaksu. Kada završite sa proverom, dopišete da nakon |provereno=. |
Modernizr (engl. Modernizr) je biblioteka Javaskripta, osmišljena da detektuje osobine HTML5 i CSS3 u velikom broju pregledača. S obzirom da su specifikacije HTML5 i CSS3 jezika za obeležavanje delimično ugrađene ili ne postoje uošte, pregledaču je teže da izabere koju tehniku da koristi pri prevođenju stranice, i kada je neophodno izbeći korišćenje svojstva ili aktiviranje radnog okruženja kao što je shim koje pokreće svojstvo. Modernizr omogućava ovu sposobnost odabira na kompletan i pravilan način.[1]
Pregled[uredi | uredi izvor]
Mnoge osobine HTML5 i CSS3 su već ugrađene u barem jedan glavni pregledač. Modernizr ispituje da li pregledač ima određenu sposobnost.[2][3][4][5] Ovo omogućava developerima da koriste nove mogućnosti koje im pruža pregledač. Modernizr aplikacija je osvojila .net nagradu za aplikaciju godine, otvorenog koda, 2010 i 2011 godine, a njen glavni developer, Pol Ajriš (engl. Paul Irish), je osvojio nagradu za developera godine.[6]
Kako radi?[uredi | uredi izvor]
Modernizr koristi prepoznavanje mogućnosti da odredi šta pretraživač može da uradi i šta ne može, pre nego da proverava svojstva pretraživača. S obzirom da mehanizam renderovanja ne mora da podržava ista svojstva u dva različita pregledača koja koriste isti mehanizam, Modernizr, zbog toga, koristi ovakav način prepoznavanja mogućnosti. Korisnici, obično, menjaju svojstva pregledača da bi omogućili pristup sajtovima koji blokiraju pristup pregledačima sa specifičnim svojstvima, bez obzira na neophodna svojstva pregledača.
Modernizr nudi mogućnost pregledanja preko 150 svojstava, zatim kreira JavaScript objekat (nazvan Modernizr) koji sadrži vrednosti kao rezultate ovih testova kao boolean vrednosti. Takođe, dodaje klase HTML elementima na osnovu svojstava koja su ili nisu podržana.
Test[uredi | uredi izvor]
Da bi izveo određivanje svojstava, Modernizr kreira element, dodeli određen skup instrukcija tom elementu, i zatim odmah pokuša da pročita informacije. Internet pregledači koji razumeju instrukcije će vratiti neku vrednost, dok pregledači koji ne razumeju će vratiti neku nedefinisanu vrednost. Modernizr će na osnovu povratne vrednosti da odredi da li pregledač podržava svojstvo ili ne.
U dokumentaciji se obično navode delovi koda koji ilustruju kako bi trebalo koristiti Modernizr aplikaciju.
Pokretanje[uredi | uredi izvor]
Modernizr aplikacija se pokreće automatski. Ne postoji Modernizr.init(), početna funkcija. Kada je aktivan, Modernizr kreira globalni objekat istog imena, koji sadrži skup boolean atributa za svako svojstvo koje detektuje. Na primer, ako Vaš pregledač sadrži canvas API, Modernizr.canvas će imati vrednost tačno, u suprotnom će imati vrednost netačno:
if (Modernizr.canvas) {
// let's draw some shapes!
} else {
// no native canvas support available :(
}
Šta Modernizr ne može da uradi?[uredi | uredi izvor]
Modernizr aplikacija neće dodati funkcionalnosti pretraživača koje nedostaju. Štaviše, HTML5 Shiv JavaScript biblioteka pruža osnovu podršku za HTML5, za Internet Eksplorer (engl. Internet Explorer) sve do verzije 9.[7]
Primeri[uredi | uredi izvor]
Modernizr Javaskript primer[uredi | uredi izvor]
<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
<title>Modernizr - JavaScript Example</title>
<script src="path/to/modernizr.js"></script>
</head>
<body>
<p id="result"></p>
<script>
elem = document.getElementById('result');
if ( Modernizr.websockets ) {
elem.innerHTML = 'Your browser supports WebSockets.';
} else {
elem.innerHTML ='Your browser does not support WebSockets.';
}
</script>
</body>
</html>
Modernizr CSS primer[uredi | uredi izvor]
<!DOCTYPE html>
<html class="no-js" lang="en">
<head>
<title>Modernizr - CSS Example</title>
<style>
.wsno,
.wsyes { display: none; }
/* Modernizr will add one of the following classes to the HTML element based on
whether or not WebSockets is supported by the user's browser. */
.no-websockets .wsno,
.websockets .wsyes { display: block; }
</style>
<script src="path/to/modernizr.js"></script>
</head>
<body>
<p class="wsno">Your browser does not support WebSockets.</p>
<p class="wsyes">Your browser supports WebSockets.</p>
</body>
</html>
Vidi još[uredi | uredi izvor]
- HTML
- HTML5
- HTML5 Shiv
- HTML5 File API
- HTML5 in mobile devices
- Comparison of layout engines (HTML5)
- Comparison of layout engines (Cascading Style Sheets)
- JavaScript
- List of JavaScript libraries
- Web Workers
- WebSocket
- WebGL
Reference[uredi | uredi izvor]
- ^ „modernizr.com”.
- ^ Faruk Ateş (22. 6. 2010). „Taking Advantage of HTML5 and CSS3 with Modernizr”.
- ^ Gil Fink (10. Jan 2011). „Detecting HTML5 Features Using Modernizr”. Proverite vrednost paramet(a)ra za datum:
|date=
(pomoć) - ^ Daniel Sellergren (februar 2011). „Using Modernizr to Determine HTML5 CSS3 Support”. Arhivirano iz originala 22. 8. 2013. g.
- ^ David Powers. „Using Modernizr to detect HTML5 and CSS3 browser support”.
- ^ .net Awards 2011:#7. Open Source App of the Year: Modernizr 2.0, #16. Developer of the Year: Paul Irish
- ^ „HTML 5 elements in IE”. Pristupljeno 14. 6. 2012.
Spoljašnje veze[uredi | uredi izvor]
- Zvanični veb-sajt
- „Drupal integration with Modernizr”.
- W3C HTML5
- W3C geolocation
- Web workers
- Web worker basics
- [1]
- Creating Cross Browser HTML5 Forms Now
- webdesignernote
- HTML Boilerplate in Ajaxian Archives
- Faruk Ateş. „Proudly Announcing Modernizr”. Arhivirano iz originala 01. 08. 2016. g. Pristupljeno 25. 05. 2015.
- „Speeding Up With Modernizr”. Arhivirano iz originala 19. 12. 2013. g. Pristupljeno 25. 05. 2015.
- „Mordernizr and Web Development”. Arhivirano iz originala 2. 5. 2015. g. Pristupljeno 25. 5. 2015.