Demo Dynamic HTML - Desplazamiento vertical de texto

Desplazamiento vertical de texto

Compatibilidad: Ms Internet Explorer

Siguiendo el modelo de los títulos de cierre de una película, esta demo visualiza texto en movimiento de abajo hacia arriba dentro de un área definida del documento.

[ Muestra el ejemplo práctico ]

el código para insertar en tu página

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

//Set these variables:

//The pixel value of where you want the layer to start (from the top)
lstart=200

//Set this to false if you just want it to go one time
loop=true

//Set the speed, lower value gives more speed
speed=100

//Set this to how many pixels you want it to go for each step, this also changes the speed.    
pr_step=5
	
/**********************************************************************
You don't have to change anything below this
**********************************************************************/

//Browsercheck
	var n = (document.layers) ? 1:0;
	var ie = (document.all) ? 1:0;

//Object constructor
function makeObj(obj,nest){
    nest=(!nest) ? '':'document.'+nest+'.'
    this.css=(n) ? eval(nest+'document.'+obj):eval(obj+'.style')
	this.scrollHeight=n?this.css.document.height:eval(obj+'.offsetHeight')
	this.up=goUp
    this.obj = obj + "Object"
    eval(this.obj + "=this")
    return this
}
//Makes the layer slide up
function goUp(speed){
	if(parseInt(this.css.top)>-this.scrollHeight){
		this.css.top=parseInt(this.css.top)-pr_step
		setTimeout(this.obj+".up("+speed+")",speed)
	}else if(loop) {
		this.css.top=lstart
		eval(this.obj+".up("+speed+")")
	  }
}
//Calls the object constructor,makes the slide object and starts the sliding.
	function slideInit(){
		oSlide=makeObj('divNews','divCont')
		oSlide.css.top=lstart
		oSlide.up(speed)
		
	}
//Start the sliding on page load.
onload=slideInit

/**********************************************************************
If you for some reason would like this to start at a event or something
just remove the previous line and place something like:
<a href="#" onclick="slideInit()">Slide!</a> in the page. 
That will make the scroll start when the user clicks
***********************************************************************/
</script>

</HEAD>

<div id="divCont" style="position:absolute; width:300; height:150; top:150; left:170; clip:rect(0,300,150,0)">
	<div id="divNews" style="position:absolute; top:0; left:0">
		<p>HTMLpoint: <br>
		HTMLpoint es el sitio italiano del web publishing donde puedes encontrar todo lo necesario para construir tu sitio. El material profesional, que puedes bajar gratuitamente, te ayudará a hacer más atractivos los contenidos de tu sitio web</p>
		<p>
	www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com<br><br>
	www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com<br>
	www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com<br>
	www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com<br>
	www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com www.htmlpoint.com<br></p>
	</div>
</div>

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