Franko Amilkar Calderón Estrada

Ciencias de computación

Ejercicio 1

Imprimir los numeros pares de un rango dado

ejercicio1

Ejercicio 2

Palabra alrevez en JavaScript

ejercicio2

Ejercicio 3

Fibonacci en JavaScript

ejercicio3

Ejercicio 4

Palindromo o no en JavaScript

ejercicio4

Ejercicio 5

Averiguar fecha de primer y último día de un mes dado de un año dado. en JavaScript

ejercicio5

Ejercicio 6

¡Calculadora de Daño Pokémon! - 4geeks enJavaScript

ejercicio6

Ejercicio 7

Visor de imagenes con JavaScript

Ejercicio7

Ejercicio8

Coche circulando

Coche en movimiento: Planteamiento

En esta página haremos un sencillo efecto de animación. Sobre un fondo móvil que se repite (por ejemplo un trozo de calle), colocamos un coche. El coche es una imagen estática, pero al mover el fondo, da la impresión de que éste está recorriendo la calle.

Necesitaremos para ello en primer lugar la imagen de fondo. Imagen de fondo: fondoCoche.gif:

Ejercicio8

Por otra parte necesitamos también la imagen del coche, la cual es una imagen gif de fondo transparente, para así poder ponerla encima del fondo. Imagen del coche: coche.gif

Ejercicio8

Como hemos dicho, lo que moveremos no será la imagen del coche, sino la del fondo. Esta imagen está hecha de tal manera que los colores y dibujos del borde derecho de la misma coincide con los del borde izquierdo, de manera que si ponemos dos copìas de la imagen seguidas en horizontal, la segunda continua el dibujo de la primera.

Colocaremos dos copias seguidas de la imagen en la misma horizontal, las dos copias se mueven a la vez de derecha a izquierda, cuando la imagen de la derecha llega a la posición donde estaba la primera, volvemos repetir el ciclo. Mientras tanto la imagen del coche sigue estática encima de las imágenes móviles. Todo ello lo encuadramos dentro de un div del tamaño de una imagen de fondo, al que llamaremos visor. El visor no debe permitir ver ningún elemento que, estando dentro de él, sobresalga de su tamaño.

El truco para conseguir imágenes en movimiento está en saber utilizar los temporizadores mediante la funcion setInterval que pone en marcha el temporizador, y clearInterval que lo para. El resto consiste en cambiar la posición de la imagen mediante el control de las propiedades CSS.