Demo Dynamic HTML - Movimiento "arriba y abajo"

Movimiento "arriba y abajo"

Compatibilidad: Ms Internet Explorer, Netscape

Imagen en continuo movimiento de arriba hacia abajo como un yo-yo.

[ 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">
<!--

function hover(obj,amplitude,angleinc,anglestart,orientation,speed) {
	if (navigator.appName=="Netscape")
		this.obj = eval("document." + obj)
	if (navigator.appName=="Microsoft Internet Explorer")
		this.obj = eval(obj + ".style")
	this.amplitude = amplitude
	this.angleinc = angleinc
	this.anglestart = anglestart
	this.angle = anglestart
	this.orientation = orientation
	this.speed = speed
	this.active = 0
	this.x = parseInt(this.obj.left)
	this.y = parseInt(this.obj.top)
	this.centerX = this.x - this.amplitude*Math.sin(this.angle*Math.PI/180)
	this.centerY = this.y + this.amplitude*Math.sin(this.angle*Math.PI/180)
	this.move = hoverMove
}

function hoverMove() {
	this.angle += this.angleinc
	if (this.orientation == "h") {
		this.x = this.centerX + this.amplitude*Math.sin(this.angle*Math.PI/180)
		this.obj.left = this.x
	}
	if (this.orientation == "v") {
		this.y = this.centerY - this.amplitude*Math.sin(this.angle*Math.PI/180)
		this.obj.top = this.y
	}
}

function init() {
	myhover = new hover("myHoverDiv",75,3,0,"v",20)
}

function start() {
	if (!myhover.active) {
		myhover.active = 1
		moveMyHover()
	}
}

function moveMyHover() {
	if (myhover.active) {
		myhover.move()
		setTimeout("moveMyHover()",myhover.speed)
	}
}

function stop() {
	myhover.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]