desplazamiento de noticias

Lautaroe · #1 (**permalink**) 15/07/2004, 14:10

Quiero saber si hay algún tutorial para hacer ese típico tablon de noticias. q van pasando los los títulos por un rectángulo y cuando te pones arriba frena y puede hacer click para ver el articulo completo.

cualquier ayuda vendría bien.

gracias

Yanix · #2 (**permalink**) 15/07/2004, 15:01

Hola,

tunait tiene un ejemplo detallado en su sitio:
http://javascript.tunait.com/javascr...denoticiasfoto
Espero te ayude.

andresito2004 · #3 (**permalink**) 16/07/2004, 10:38

Hola ... para darte una solucion facil .. adjunto te pongo un codigo de lo que creo quieres hacer ... suerte.

<HTML>
<HEAD>
<TITLE></TITLE>
</HEAD>
<BODY><SCRIPT LANGUAGE="JavaScript">

//variables de ancho, alto, color de fondo
var scrollerwidth=150
var scrollerheight=100
var scrollerbgcolor='#C0C0C0'
var scrollerbackground='fondo.gif'

//Links que quieres que salgan, se pueden añadir mas
var messages=new Array()
messages[0]="<font face='Arial'><a href='http://www.elpelao.com'><b>Elpelao.com Programas gratis</b></a></font>"
messages[1]="<font face='Arial'><a href='http://www.medicina21.com'><b>Medicina XXI</b></a></font>"
messages[2]="<font face='Arial'><a href='http://www.google.com'><b>Google - El mejor buscador</b></a></font>"

if (messages.length>1)
i=2
else
i=0

function move1(whichlayer){
tlayer=eval(whichlayer)
if (tlayer.top>0&&tlayer.top<=5){
tlayer.top=0
setTimeout("move1(tlayer)",3000)
setTimeout("move2(document.main.document.second)", 3000)
return
}
if (tlayer.top>=tlayer.document.height*-1){
tlayer.top-=5
setTimeout("move1(tlayer)",100)
}
else{
tlayer.top=scrollerheight
tlayer.document.write(messages[i])
tlayer.document.close()
if (i==messages.length-1)
i=0
else
i++
}
}

function move2(whichlayer){
tlayer2=eval(whichlayer)
if (tlayer2.top>0&&tlayer2.top<=5){
tlayer2.top=0
setTimeout("move2(tlayer2)",3000)
setTimeout("move1(document.main.document.first)",3 000)
return
}
if (tlayer2.top>=tlayer2.document.height*-1){
tlayer2.top-=5
setTimeout("move2(tlayer2)",100)
}
else{
tlayer2.top=scrollerheight
tlayer2.document.write(messages[i])
tlayer2.document.close()
if (i==messages.length-1)
i=0
else
i++
}
}

function move3(whichdiv){
tdiv=eval(whichdiv)
if (tdiv.style.pixelTop>0&&tdiv.style.pixelTop<=5){
tdiv.style.pixelTop=0
setTimeout("move3(tdiv)",3000)
setTimeout("move4(second2)",3000)
return
}
if (tdiv.style.pixelTop>=tdiv.offsetHeight*-1){
tdiv.style.pixelTop-=5
setTimeout("move3(tdiv)",100)
}
else{
tdiv.style.pixelTop=scrollerheight
tdiv.innerHTML=messages[i]
if (i==messages.length-1)
i=0
else
i++
}
}

function move4(whichdiv){
tdiv2=eval(whichdiv)
if (tdiv2.style.pixelTop>0&&tdiv2.style.pixelTop<=5){
tdiv2.style.pixelTop=0
setTimeout("move4(tdiv2)",3000)
setTimeout("move3(first2)",3000)
return
}
if (tdiv2.style.pixelTop>=tdiv2.offsetHeight*-1){
tdiv2.style.pixelTop-=5
setTimeout("move4(second2)",100)
}
else{
tdiv2.style.pixelTop=scrollerheight
tdiv2.innerHTML=messages[i]
if (i==messages.length-1)
i=0
else
i++
}
}

function startscroll(){
if (document.all){
move3(first2)
second2.style.top=scrollerheight
second2.style.visibility='visible'
}
else if (document.layers){
document.main.visibility='show'
move1(document.main.document.first)
document.main.document.second.top=scrollerheight+5
document.main.document.second.visibility='show'
}
}

window.onload=startscroll

</SCRIPT> <LAYER ID="first" LEFT="0" TOP="1" WIDTH="&{scrollerwidth};">
<ILAYER ID="main" WIDTH="&{scrollerwidth};"
HEIGHT="&{scrollerheight};" BGCOLOR="&{scrollerbgcolor};" VISIBILITY="hide"> <SCRIPT LANGUAGE="JavaScript1.2">
if (document.layers)
document.write(messages[0])
</SCRIPT> </ILAYER></LAYER>
<LAYER ID="second" LEFT="0" TOP="0" WIDTH="&{scrollerwidth};"
VISIBILITY="hide"> <SCRIPT LANGUAGE="JavaScript1.2">
if (document.layers)
document.write(messages[1])
</SCRIPT> </LAYER>
<DIV ALIGN="center"> <SCRIPT LANGUAGE="JavaScript1.2">
if (document.all){
document.writeln('<span id="main2" style="position:relative;width:'+scrollerwidth+';h eight:'+scrollerheight+';overflow:hiden;background-color:'+scrollerbgcolor+' ;background-image:url('+scrollerbackground+')">')
document.writeln('<div style="position:absolute;width:'+scrollerwidth+';h eight:'+scrollerheight+';clip:rect(0 '+scrollerwidth+' '+scrollerheight+' 0);left:0;top:0">')
document.writeln('<div id="first2" style="position:absolute;width:'+scrollerwidth+';l eft:0;top:1;">')
document.write(messages[0])
document.writeln('</div>')
document.writeln('<div id="second2" style="position:absolute;width:'+scrollerwidth+';l eft:0;top:0;visibility:hidden">')
document.write(messages[1])
document.writeln('</div>')
document.writeln('</div>')
document.writeln('</span>')
}
</SCRIPT></DIV> </BODY>
</HTML>