modernizr

Modernizr es un paquete de detección de las capacidades de un navegador relativas a HTML5 y CSS3.

1) Desarrollo (Development)
Es un script completo, con todas las funcionalidades básicas de Modernizr, sin comprimir y con comentarios. Ideal para la fase de desarrollo de nuestro proyecto. Luego sería recomendable descargar un paquete idóneo para producción.

2) Producción (Production)
Para hacer esta descarga se ofrece una página donde podemos seleccionar las funcionalidades de detección que queremos incluir, porque estemos utilizándolas en nuestro proyecto.

Se recomienda cargar el script en el head.

Ejemplo

<script src="modernizr.js" type="text/javascript"></script>
<script type="text/javascript">
	if(Modernizr.boxshadow) {
		alert("SI sombra caja");
	} else {
		alert("NO sombra caja");
	}

	if(Modernizr.canvas) {
		alert("SI canvas");
	} else {
		alert("NO canvas");
	}
</script>
Ver ejemplo de uso de modernizr

Polyfill

Un polyfill o polyfiller, es una pieza de código (o plugin) que proporciona la tecnología que se espera que el navegador proporcione de forma nativa.

Ejemplo autofocus

<script src="modernizr.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>


<script type="text/javascript">
	$(document).ready(function() {
		if (!Modernizr.input.autofocus) {
		$("input[autofocus]").focus(); 
	}
});
</script>
<input type="text" />

<input type="text" autofocus="autofocus"/>

<input type="text" />

<input type="text" />
Ver ejemplo modernizr autofocus
icono de mandar un mail¡Contacta conmigo!
Pablo Monteserín
contacta conmigoPablo Monteserín

¡Hola! ¿En qué puedo ayudarte?