Via Twitter descubro que Firefox 3.7 (la versión pre-alpha2) ya dispone de CSS Transtions. El sistema con el cual mediante sentencias CSS podemos aplicar movimiento a elementos HTML de nuestra página. Esta funcionalidad, disponible en WebKit desde hace ya bastante tiempo, nos permite realizar tareas que actualmente se realizan mediante Javascript, en la capa de funcionalidad, en la capa de diseño, algo que ha levantado dispares opiniones al respecto.
// HTML
<ul>
<li id="long1">Long, gradual transition...</li>
<li id="fast1">Very fast transition...</li>
<li id="delay1">Long transition with a 2-second delay...</li>
<li id="easeout">Using ease-out timing...</li>
<li id="linear">Using linear timing...</li>
<li id="cubic1">Using cubic-bezier(0.2, 0.4, 0.7, 0.8)...</li>
</ul>
// CSS
#delay1 {
position: relative;
-moz-transition-property: font-size;
-moz-transition-duration: 4s;
-moz-transition-delay: 2s;
font-size: 14px;
}
#delay1:hover {
-moz-transition-property: font-size;
-moz-transition-duration: 4s;
-moz-transition-delay: 2s;
font-size: 36px;
}
Podemos descargar la última versión de desarrollo de Firefox y probarlas en nuestras manos usándo la documentación que Mozilla nos ha preparado.
17 comentarios, 0 referencias
+
#