Tecnología

Inicio

Cómo hacer una animación JPEG

January 18

Los archivos JPEG no pueden almacenar varias imágenes en un solo archivo como GIF lata. Sin embargo, puede realizar una secuencia de animación de archivos JPEG utilizando JavaScript, el lenguaje de programación para el navegador Web. Las sentencias de JavaScript más importantes para este proyecto incluyen la afirmación "setInterval", que establece un temporizador que repeatedy ejecuta una función definida. Otras declaraciones claves son aquellos para cambiar dinámicamente la propiedad "src" de una etiqueta HTML "img".

Instrucciones

1 Para abrir WordPad y pegar las siguientes líneas de código HTML. Estas declaraciones definen una página Web en blanco, sobre el cual se puede añadir código JavaScript que anima a los archivos JPEG y otros tipos de imágenes.

<Html>
<Head>
</ Head>
<Body>
</ Body>
</ Html>

2 Pegar las siguientes declaraciones después de la etiqueta "cabeza" en el documento. Estas declaraciones definen y ejecutan una función JavaScript llamada anim_img que carga los archivos JPEG en la página Web. La declaración "setInterval" después de esta función se llama a esta función cuando se carga la página Web en el navegador Web. Para poder utilizar este código JavaScript, HTML escribir una declaración en la sección "cuerpo" del documento que utiliza la etiqueta "img" llamado "myJPEGs."

<Script type = "text / javascript">
var idx_img = 1;
/

Cargar las imágenes de animación /
var JPEG1 = new Image ();
JPEG1.src = "m1.jpg";
var JPEG2 = new Image ();
JPEG2.src = "m2.jpg";
var JPEG3 = new Image ();
JPEG3.src = "m3.jpg";

anim_img función (x)
{
si (== idx_img 4)
{
idx_img = 1;
}
var src_of_image = "m" + + idx_img ".jpg";
document.myJPEGs.src = src_of_image;
idx_img ++;
}
t = setInterval ( "anim_img (idx_img)", 500);
</ Script>

3 Pegar las siguientes declaraciones después de la etiqueta "cuerpo" en el documento. Esta sentencia define una etiqueta "img" llamado "myjpegs." Esa etiqueta incluye una ruta de acceso al primer archivo JPEG en su secuencia de animación. El "nombre" y "id" atributos con los "myJPEGs" valor que el código JavaScript para cambiar el nombre de ruta que acabamos de mencionar. El atributo "src" de la etiqueta "img" está ajustado a la ruta de acceso.

<Img id = "myJPEGs" name = "myJPEGs" src = "m1.jpg">

4 Pulse la tecla "Control" y "S" al mismo tiempo para abrir el cuadro de diálogo para guardar documentos. Anote el nombre de la carpeta en la que va a guardar el documento y, a continuación, escriba un nombre en el cuadro de texto "Nombre de archivo" que termina en ".htm".

5 Haga clic en la opción "Texto sin formato" en la lista desplegable "Tipo" y haga clic en "Guardar" para guardar la página Web en el disco.

6 Abra el Explorador de Windows y, a continuación, vaya a una carpeta con varias imágenes JPEG, por ejemplo, la carpeta "Mis imágenes". Utilice los controles del explorador para seleccionar tres imágenes JPEG, y luego presione "Control" y "C" al mismo tiempo para copiar las imágenes en el portapapeles de Windows.

7 Vaya a la carpeta en la que guardó el documento Web y luego presione "Control" y "V" al mismo tiempo para pegar los archivos JPEG en la carpeta. Utilice el Explorador de "Cambiar el nombre de" comando para cambiar el nombre de las imágenes como "m1.jpg", "m2.jpg," y "m3.jpg".

8 Haga clic en su documento html y presionar "Enter" para abrir el documento en el navegador Web. Verá la secuencia animada de los archivos JPEG.