Demo Dynamic HTML - Imagen animada

Imagen animada

Compatibilidad: Ms Internet Explorer, Netscape

Fácilmente configurable (es suficiente sustituir la imagen "vespa.gif" con otra imagen, incluso de tamańo diferente). Esta demo es ante todo un ejemplo que nos ayudará a comprender las potencialidades del HTML dinámico.

[ Muestra el ejemplo práctico ]

el código para insertar en tu página

<TITLE>Demo Dynamic HTML: ejemplo práctico </TITLE>

bName = navigator.appName;

bVer = parseInt(navigator.appVersion);

if      (bName == "Netscape" && bVer == 4) ver = "n";

else if (bName == "Microsoft Internet Explorer" && bVer == 4) ver = "ie";

function init() {

if (ver == "n") {

pic = document.picDiv

pic.xcor = pic.left

pic.ycor = pic.top

}

else if (ver == "ie") {

pic = picDiv.style

pic.xcor = pic.pixelLeft

pic.ycor = pic.pixelTop

}

pic.pathx = new Array(64,78,105,146,203,263,334,392,432,463,476,466,445,416,385,352,344,343,319,279,272,276,273,244,202,167,132,107,78,54)

pic.pathy = new Array(74,102,135,159,186,197,203,207,185,154,121,80,64,57,59,81,109,138,153,140,114,89,53,43,42,45,54,35,26,52)

//Control Panel for Variables

pic.pathcor = 0				//don't change

pic.active = 1               // set to 1 to begin when page loads

pic.pathloop = 1            // set to 1 to loop, 0 not to loop

speed = .01					// time between points in seconds

picpath()}

function picpath() {

if (pic.active && pic.pathcor < pic.pathx.length) {

pic.xcor = pic.pathx[pic.pathcor]

pic.ycor = pic.pathy[pic.pathcor]

pic.left = pic.xcor

pic.top = pic.ycor

pic.pathcor += 1

setTimeout("picpath()",speed*1000)

}

else {

if (pic.active && pic.pathloop && pic.active) {

pic.pathcor = 0

picpath()

}

else pic.active = 0

}

//-->

</SCRIPT>

</HEAD>

</body>
</html>

[Baja en un único archivo .zip, las imágenes y demás archivos necesarios
para el funcionamiento de las demo de esta sección]