HTML5, CSS3 y Un Poco Más

En el ejemplo de hoy vamos a ver cómo realizar un pequeño cronometro táctil (para móviles Firefox OS), los elementos que utilizaremos son la librería JavaScript Zepto.js la cual es una versión comprimida de JQuery.js y a su vez es un tanto más ligera y fácil de emplear, otra librería que usaremos en touch.js, para detectar los toques (tap´s) o deslizamientos (swipe´s) dentro de un móvil, así también te mostraré como configurar la aplicación para que pueda ser cargada dentro del simulador de Firefox. Cronometro en Firefox OS El comportamiento que tendrá nuestra aplicación es el siguiente, cuando presionemos sobre el reloj, este comenzará su curso, y deseamos registrar un tiempo dentro de nuestro cronometro basta con deslizar nuestro dedo sobre el reloj, hacia la derecha, con lo cual el tiempo quedara registrado en la parte inferior del cronometro, si deseamos detener el cronometro, solo tenemos que presionar sobre él, o deslizar nuestro dedo hacia la izquierda

En ejemplo te mostraré como crear la validación de un formulario , con etiquetas de html5 y sus nuevos atributos y como manipular estos atributos con ayuda de CSS3. Como se aprecia en la imagen, el formulario indica cuales son los campos requeridos, el formato que deben de llevar cada uno de ellos, para poder ser aceptados, veamos como hacer cada uno de los campos. todas la etiquetas para el ingreso de datos que se utilizan en este ejemplo son de tipo <input/> . "Ingresa tu Nombre" Esta etiqueta es de tipo text y mediante el atributo autofocus indicamos que el cursor debe de iniciar por defecto en ese campo al cargar la pagina, al poner la palabra required dentro de las etiquetas input forzamos al formulario a no ser enviado mientras este campo no se encuentra debidamente rellenado, con el atributo title , generamos una texto que aparecerá cuando acerquemos el puntero del ratón al campo, con el atributo pattern establecemos el patrón con el qu

En este ejemplo se muestra como trabajar dinámicamente, con iframes como agregar o quitar iframes internos solo con el uso de JS específicamente con la librería Zeptojs , y con la ayuda de flexbox, para hacer que automáticamente si llegamos al limite horizontal de nuestra pantalla los iframes se continúen agregando  en una linea inferior. Los códigos clave de de este ejemplo son: HTML: CSS: JS: Ejemplo: DESCARGAR