JavaScript - Scroll noticias vertical

 
Vista:

Scroll noticias vertical

Publicado por Greca (2 intervenciones) el 25/03/2012 13:49:50
Estoy usando el código que pongo al final de la nota y tengo un problema de navegador. 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?
Posteo aquí el código.

Código CSS:
1
2
3
4
5
6
7
8
9
#marqueecontainer{
position: relative;
width: 266px; /*marquee width */
height: 200px; /*marquee height */
background-color: white;
overflow: hidden;
padding: 2px;
padding-left: 4px;
}




Código Javascript:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
/***********************************************
* 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:

1
2
3
4
5
6
7
8
9
10
11
<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>



Muchas gracias por adelantado.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve
Val: 3.162
Oro
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Scroll noticias vertical

Publicado por xve (2100 intervenciones) el 25/03/2012 18:05:05
Hola Greca, a que versión de IE te refieres??
Lo he probado con IE8 y IE9 y en los funciona a la perfección...

Te adjunto el código completo que he utilizado:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
<html>
<head>
<style>
#marqueecontainer{
    position: relative;
    width: 266px; /*marquee width */
    height: 200px; /*marquee height */
    background-color: white;
    overflow: hidden;
    padding: 2px;
    padding-left: 4px;
}
</style>
 
<script type='text/javascript'>
    /***********************************************
    * 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
</script>
</head>
 
<body>
    <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>
</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Scroll noticias vertical

Publicado por Greca (2 intervenciones) el 25/03/2012 21:46:10
Si, ya me di cuenta que en la 8 y 9 funciona, es en la 6 y la 7 donde no funciona.. Me han dicho que es un problema de estas versiones. Que cuando en el css hay un position: relative el overflow: hidden, no funciona. Que el position debe ser absolute. pero eso me trae otros problemas.. así que sigo investigando, como solucionarlo. De momento tendré que esperar un par de días para poder testearlo en la versión 7, que la tengo en otra maquina y no en esta. Muchas gracias xve por tu colaboración.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar