Модернизр (енгл. Modernizr) је библиотека Јаваскрипта, осмишљена да детектује особине HTML5 и CSS3 у великом броју прегледача. С обзиром да су спецификације HTML5 и CSS3 језика за обележавање делимично уграђене или не постоје уоште, прегледачу је теже да изабере коју технику да користи при превођењу странице, и када је неопходно избећи коришћење својства или активирање радног окружења као што је shim које покреће својство. Модернизр омогућава ову способност одабира на комплетан и правилан начин.[1]

Преглед уреди

Многе особине HTML5 и CSS3 су већ уграђене у барем један главни прегледач. Модернизр испитује да ли прегледач има одређену способност.[2][3][4][5] Ово омогућава девелоперима да користе нове могућности које им пружа прегледач. Модернизр апликација је освојила .net награду за апликацију године, отвореног кода, 2010 и 2011 године, а њен главни девелопер, Пол Ајриш (енгл. Paul Irish), је освојио награду за девелопера године.[6]

Како ради? уреди

Модернизр користи препознавање могућности да одреди шта претраживач може да уради и шта не може, пре него да проверава својства претраживача. С обзиром да механизам рендеровања не мора да подржава иста својства у два различита прегледача која користе исти механизам, Модернизр, због тога, користи овакав начин препознавања могућности. Корисници, обично, мењају својства прегледача да би омогућили приступ сајтовима који блокирају приступ прегледачима са специфичним својствима, без обзира на неопходна својства прегледача.

Модернизр нуди могућност прегледања преко 150 својстава, затим креира JavaScript објекат (назван Модернизр) који садржи вредности као резултате ових тестова као boolean вредности. Такође, додаје класе HTML елементима на основу својстава која су или нису подржана.

Тест уреди

Да би извео одређивање својстава, Модернизр креира елемент, додели одређен скуп инструкција том елементу, и затим одмах покуша да прочита информације. Интернет прегледачи који разумеју инструкције ће вратити неку вредност, док прегледачи који не разумеју ће вратити неку недефинисану вредност. Модернизр ће на основу повратне вредности да одреди да ли прегледач подржава својство или не.

У документацији се обично наводе делови кода који илуструју како би требало користити Модернизр апликацију.

Покретање уреди

Модернизр апликација се покреће аутоматски. Не постоји Modernizr.init(), почетна функција. Када је активан, Модернизр креира глобални објекат истог имена, који садржи скуп boolean атрибута за свако својство које детектује. На пример, ако Ваш прегледач садржи canvas API, Modernizr.canvas ће имати вредност тачно, у супротном ће имати вредност нетачно:

  if (Modernizr.canvas) {
    // let's draw some shapes!
  } else {
    // no native canvas support available :(
  }

Шта Модернизр не може да уради? уреди

Модернизр апликација неће додати функционалности претраживача које недостају. Штавише, HTML5 Shiv JavaScript библиотека пружа основу подршку за ХТМЛ5, за Интернет Експлорер (енгл. Internet Explorer) све до верзије 9.[7]

Примери уреди

Модернизр Јаваскрипт пример уреди

<!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>

Модернизр CSS пример уреди

<!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>

Види још уреди

Референце уреди

  1. ^ „modernizr.com”. 
  2. ^ Faruk Ateş (22. 6. 2010). „Taking Advantage of HTML5 and CSS3 with Modernizr”. 
  3. ^ Gil Fink (10. Jan 2011). „Detecting HTML5 Features Using Modernizr”.  Проверите вредност парамет(а)ра за датум: |date= (помоћ)
  4. ^ Daniel Sellergren (фебруар 2011). „Using Modernizr to Determine HTML5 CSS3 Support”. Архивирано из оригинала 22. 8. 2013. г. 
  5. ^ David Powers. „Using Modernizr to detect HTML5 and CSS3 browser support”. 
  6. ^ .net Awards 2011:#7. Open Source App of the Year: Modernizr 2.0, #16. Developer of the Year: Paul Irish
  7. ^ „HTML 5 elements in IE”. Приступљено 14. 6. 2012. 

Спољашње везе уреди