Estoy luchando por crear una animación simple basada en esos relojes viejos con números abatibles. He añadido una imagen abajo de copiado de un PSD regalo de promoción que se encuentra en premium Píxeles:¿Codificando una animación de flip-clock de jQuery estilo rolodex?
El mayor problema que estoy corriendo en está construyendo una animación de "voltear" usando jQuery todo en HTML/CSS/JavaScript . El único tutorial que he encontrado es from this net tuts+ article que en realidad usa imágenes. Divide la mitad superior e inferior del reloj en dos conjuntos de imágenes diferentes y los reemplaza por cada segundo que pasa ...
Este método no es realista en un sitio web ya que no proporciona un contexto real para los lectores. Preferiría tener los números codificados de forma rígida en HTML y realizar la animación de volteo únicamente a través de jQuery, preferiblemente sin imágenes, excepto cuadros de ticker de fondo. O para decirlo de otra manera, los números están codificados en HTML, pero el reloj en sí es una serie de imágenes BG de estilo rolodex.
Espero haber explicado esto lo suficientemente bien. He estado luchando en esto durante unos días y sinceramente no tengo idea de cómo acercarme a este guión. ¿Tal vez dividiendo las mitades superior e inferior en diferentes divs, luego cambie los números internos para cada segundo que pase? Estoy bastante acomodado en jQuery pero soy débil en animaciones.
¡Gracias de antemano por su asistencia!
Tal vez esto podría ser un comienzo .. http://dabblet.com/gist/2360985 –
@OscarBroman Niza, pero parece que es una característica experimental y no se admite en la mayoría de versiones. –
La mayoría de los navegadores actualizados lo admiten, excepto para IE (como es habitual). –