Demo Dynamic HTML - Movimiento diagonal hacia arriba

Movimiento diagonal hacia arriba

Compatibilidad: Ms Internet Explorer, Netscape

Imagen de un punto en movimiento hacia arriba siguiendo una trayectoria diagonal, con otro enlace que la devuelve a la posición inicial

[ Muestra el ejemplo práctico ]

el código para insertar en tu página

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

<SCRIPT LANGUAGE="JavaScript">
<!--

n = (document.layers) ? 1:0
ie = (document.all) ? 1:0

function init() {
	if (n) block = document.blockDiv
	if (ie) block = blockDiv.style
	block.xpos = parseInt(block.left)
	block.ypos = parseInt(block.top)
	block.angle = 30
	block.xinc = 5*Math.cos(block.angle*Math.PI/180)
	block.yinc = 5*Math.sin(block.angle*Math.PI/180)
	block.count = 0
}

function slide() {
	if (block.count < 25) {
		block.xpos += block.xinc
		block.ypos -= block.yinc
		block.left = block.xpos
		block.top = block.ypos
		block.count += 1
		setTimeout("slide()",30)
	}
	else block.count = 0
}

function restart() {
	block.count = 0
	moveTo(block,150,150)
}

function moveTo(obj,x,y) {
	obj.xpos = x
	obj.ypos = y
	obj.left = obj.xpos
	obj.top = obj.ypos
}

//-->
</SCRIPT>

</HEAD>

<A HREF="javascript:slide()">Mueve</A> - <A HREF="javascript:restart()">En marcha otra vez</A>

</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]