Responsive Elements es un genial recurso para quienes trabajan con diseños adaptativos (aka responsive design)
Este plugin, basado en jQuery, permite que cualquier elemento se adapte y responda al área que ocupa
La idea—si bien simple—se le ocurrió a Kumail Hunaid (diseñador y desarrollador de aplicaciones Web) y es muy sencillo implementarla. Sólo hay que cargar, antes del cierre de las etiquetas de cabecera (aka head) de la página Web, la librería de jQuery y luego este pequeño script
<script type="text/javascript" src="jquery.min.js"> </script> <script type="text/javascript" src="responsive-elements.js"> </script> |
Luego hay que declarar los elementos que serán afectados
<div class="quote" data-respond> |
Finalmente hay que declarar mediante los parámetros más grande que y menor que las CLASSes y los puntos de ruptura donde se adaptará el diseño
.quote.lt500 {background: blue} .quote.gt150.lt300 {background: red} |
De manera opcional se puede trabajar con parámetros como start, end e interval
<div class="quote" data-respond="start: 100px; end: 900px; interval: 50px;"> |
Sitio Web | Responsive Elements
Podés encontrar a Daniel en Google+