scroll de noticias vertical

VENTUACE · #1 (**permalink**) 19/02/2003, 06:54

Tengo un problema.El codigo de la marquesina vertical me funciona bien,pero lo que quiero hacer es que salgan las lineas por encima de un dibujo que es un tablon de anuncios.
A ver si vosotros me podeis ayudar.Saludos y gracias.

Yanix · #2 (**permalink**) 19/02/2003, 07:32

Pues no entendi bien la duda...si explicas un poco mejor quizas te podamos dar una mano

A que líneas te refieres? y cómo es lo del dibujo?

VENTUACE · #3 (**permalink**) 19/02/2003, 09:40

Quiero hacer algo parecido a lo de esta web.
http://www.maestrosdelweb.com
Es el cuadro de la derecha lo de los mensajes recientes.
Lo de la marquesina me funciona bien,pero lo que quiero es ponerle de fondo una imagen.

Yanix · #4 (**permalink**) 19/02/2003, 10:45

Te recomiendo visites:
http://www.forosdelweb.com/showthrea...hreadid=109477

Y el script está en:
http://dynamicdrive.com/dynamicindex2/cmarquee2.htm

Lo que se hizo en maestrosdelweb fue crear una tabla con varias filas. En la primera fila colocaron el logo de forosdelweb, en la segunda el texto de Mensajes Recientes y en la tercera fila se colocó el script como tal.

Para hacerlo, debes crear una tabla primero. Ejemplo, una tabla con dos filas. En la primera colocas la imagen (eso va entre el primer <TD> y </TD>). Luego, en la segunda fila coloca el script.
Esto es solamente un ejemplo:

Código:

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
<p>Mi foto, logo, o lo que sea va entre el primer &lt;TD&gt; y &lt;/TD&gt; </p>
<p>Y luego en el pr&oacute;ximo &lt;TD&gt; o Table Data es que ira el script o 
  en cualquier parte del &lt;BODY&gt; donde desees el efecto de scrolling..</p>
<table width="12%" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td bgcolor="#000000">
<div align="center"><img src="http://www.upichat.net/images/logo.gif "></div>
      </a></td>
  </tr>
  <tr>
    <td bgcolor="#CCCCFF"> 
      <script language="JavaScript1.2">

/*
Cross browser Marquee II- © Dynamic Drive (www.dynamicdrive.com)
For full source code, 100's more DHTML scripts, and TOS, visit http://www.dynamicdrive.com
Credit MUST stay intact
*/

//Specify the marquee's width (in pixels)
var marqueewidth=200
//Specify the marquee's height
var marqueeheight=150
//Specify the marquee's marquee speed (larger is faster 1-10)
var marqueespeed=2
//Pause marquee onMousever (0=no. 1=yes)?
var pauseit=1

//Specify the marquee's content
//Keep all content on ONE line, and backslash any single quotations (ie: that\'s great):

var marqueecontent='<font face="Verdana">Thank you for visiting <a href="http://www.dynamicdrive.com">Dynamic Drive.</a><p>If you find this script useful, please consider linking to us by <a href="../link.htm">clicking here.</a><p>Visit our partner <a href="http://javascriptkit.com">JavaScript Kit</a> for JavaScript tutorials.</font>'


////NO NEED TO EDIT BELOW THIS LINE////////////

marqueespeed=(document.all)? marqueespeed : Math.max(1, marqueespeed-1) //slow speed down by 1 for NS
var copyspeed=marqueespeed
var pausespeed=(pauseit==0)? copyspeed: 0
var iedom=document.all||document.getElementById
var actualheight=''
var cross_marquee, ns_marquee

function populate(){
if (iedom){
cross_marquee=document.getElementById? document.getElementById("iemarquee") : document.all.iemarquee
cross_marquee.style.top=marqueeheight+8
cross_marquee.innerHTML=marqueecontent
actualheight=cross_marquee.offsetHeight
}
else if (document.layers){
ns_marquee=document.ns_marquee.document.ns_marquee2
ns_marquee.top=marqueeheight+8
ns_marquee.document.write(marqueecontent)
ns_marquee.document.close()
actualheight=ns_marquee.document.height
}
lefttime=setInterval("scrollmarquee()",50)
}
window.onload=populate

function scrollmarquee(){

if (iedom){
if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8))
cross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed
else
cross_marquee.style.top=marqueeheight+8
}
else if (document.layers){
if (ns_marquee.top>(actualheight*(-1)+8))
ns_marquee.top-=copyspeed
else
ns_marquee.top=marqueeheight+8
}
}

if (iedom||document.layers){
with (document){
if (iedom){
write('<div style="position:relative;width:'+marqueewidth+';height:'+marqueeheight+';overflow:hidden" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">')
write('<div id="iemarquee" style="position:absolute;left:0;top:0;width:100%;">')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+marqueewidth+' height='+marqueeheight+' name="ns_marquee">')
write('<layer name="ns_marquee2" width='+marqueewidth+' height='+marqueeheight+' left=0 top=0 onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed"></layer>')
write('</ilayer>')
}
}
}
</script></td>
  </tr>
</table>
<p>&nbsp;</p>
</body>
</html>

Observa que mi imagen era muy pequeña, así que a esa celda en especifica le puse color negro como background. Cualquier duda, pues por aquí estamos.

VENTUACE · #5 (**permalink**) 20/02/2003, 09:51

Ya lo he hecho y funciona correctamente,pero cuando subo la web no funciona,a que puede deberse eso???
Tengo mas cosas de javascript y funcionan correctamente.
Gracias por ayudarme Yanix.

Greca · #6 (**permalink**) 24/03/2012, 12:02

Perdón por recuperar un hilo antiguo, pero es que es precisamente el código que estoy usando y tengo un problema. En Firefox/Chrome/etc funciona sin problemas. En IExplorer se sale del "recuadro" y el texto ocupa todo el alto de la página, sin limitarse al "#marqueecontainer". Alguna sugerencia/ayuda/tal vez solución?

Mil gracias como siempre.

Greca · #7 (**permalink**) 24/03/2012, 12:05

Por si acaso, pasteo el código tal cual lo estoy usando:

Código CSS:

Ver original#marqueecontainer{
position: relative;
width: 266px; /*marquee width */
height: 200px; /*marquee height */
background-color: white;
overflow: hidden;
padding: 2px;
padding-left: 4px;
}

Código Javascript:

Ver original/***********************************************
* Cross browser Marquee II- © Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
 
var delayb4scroll=2000 //Specify initial delay before marquee starts to scroll on page (2000=2 seconds)
var marqueespeed=1.5 //Specify marquee scroll speed (larger is faster 1-10)
var pauseit=1 //Pause marquee onMousever (0=no. 1=yes)?
 
////NO NEED TO EDIT BELOW THIS LINE////////////
 
var copyspeed=marqueespeed
var pausespeed=(pauseit==0)? copyspeed: 0
var actualheight=''
 
function scrollmarquee(){
if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8))
cross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed+"px"
else
cross_marquee.style.top=parseInt(marqueeheight)+8+"px"
}
 
function initializemarquee(){
cross_marquee=document.getElementById("vmarquee")
cross_marquee.style.top=0
marqueeheight=document.getElementById("marqueecontainer").offsetHeight
actualheight=cross_marquee.offsetHeight
if (window.opera || navigator.userAgent.indexOf("Netscape/7")!=-1){ //if Opera or Netscape 7x, add scrollbars to scroll and exit
cross_marquee.style.height=marqueeheight+"px"
cross_marquee.style.overflow="scroll"
return
}
setTimeout('lefttime=setInterval("scrollmarquee()",30)', delayb4scroll)
}
 
if (window.addEventListener)
window.addEventListener("load", initializemarquee, false)
else if (window.attachEvent)
window.attachEvent("onload", initializemarquee)
else if (document.getElementById)
window.onload=initializemarquee

Código HTML:

Ver original<div id="marqueecontainer" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">
<div id="vmarquee" style="position: absolute; width: 98%;">
 
<!--YOUR SCROLL CONTENT HERE-->
 
Aquí va todo el contenido que obvio para no sobrecargar innesariamente, ya que es todo texto.
 
<!--YOUR SCROLL CONTENT HERE-->
 
</div>
</div>

JavierB · #8 (**permalink**) 24/03/2012, 12:08

Hola Greca

Te recuerdo el aviso que había al final de este tema y que parece que no has leído o no le has hecho ni caso.

Tema cerrado.