scrollTop + pageYOffset

el_javi · #1 (**permalink**) 07/09/2006, 17:25

Buenas noches.

Tengo una duda muy dudosa

Estoy intentando sacar la posición Y del Scroll.

En Firefox, me funciona correctamente usando la función window.pageYOffset

Pero en Internet Explorer, no me funciona document.documentElement.scrollTop

Me gustaría que alguna persona me ayude en saber como sacar la posición que ocupa el scroll.

Espero vuestros comentarios.

Gracias de antemano.

tunait · #2 (**permalink**) 08/09/2006, 04:59

Hola el_Javi

Qué doctype estás usando?

para xhtml hay que usar documentElement y para html se usa body ¿ya probaste?

un saludo

Rafael · #3 (**permalink**) 20/09/2006, 00:40

Tengo el mismo problema.
Usando el doctype xhtml no me funcionaba el body. Cambiándolo por documentElement funciona ya, pero deja de funcionar en Firefox (que si funciona con body)

¿Tenemos que regresar a los viejos tiempos de detectar el navegador?

Rafael · #4 (**permalink**) 20/09/2006, 13:11

Leyendo y releyendo los posts del ¿método? scrollTop, como que entiendo que no es estándar.

window.document.documentElement.scrollTop
tampoco
window.pageYOffset

Incluso en el destripador de Caricatos no aparece este (o algo parecido).

Y el preguntón de mi, cada vez pregunta más.

1) ¿Hay alguna opción estándard?

Por el momento estoy usando un

Código PHP:

  if (document.all) {window.document.documentElement.scrollTop;}

else {window.pageYOffset;}

2) ¿Por que afecta tanto el doctype para este script?
con xhtml funciona en ie y con html4 el ff.

el_javi · #5 (**permalink**) 21/09/2006, 09:19

Gracias a tod@s por la atención que estais mostrando nuevamente en los post que se hacen.

Rafael: Gracias por tu contestación.. creo que andamos en lo mismo, y ninguno con una solución muy "Estandar".

Si el "destripador" de Caricatos, no nos ha ayudado.. eso "Mal fario"...

A ver si conseguimos que alguien nos de una ayudita con el mismo tema

Tunait: Siento no haber podido contestarte antes.... Mi DOCTYPE es <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

Es el más estandar que llevo usando en mis 3 años y medio de trabajo en Web como "pofesional".
Siempre te encuentras con incompatibilidades (y sueles salir del paso), pero esuqe esta no consigo una alternativa...

Gracais de nuevo a tod@s

kepawe · #6 (**permalink**) 21/09/2006, 12:51

Hola el_javi y compañía.

Prueba con esta functión.

Código:

var scroll_top = function(){

	if(window.pageYOffset){
		return window.pageYOffset;
	 }
	 else {
		return  Math.max(document.body.scrollTop,document.documentElement.scrollTop);
	 }

}

Saludos

el_javi · #7 (**permalink**) 21/09/2006, 15:32

Hola a tod@s de nuevo.

Querido amig@ kepawe... MUCHAS GRACIAS POR TU AYUDA.

Me parece correcto, además de que lo he probado, y funciona a la perfección en IE 6, IE 5.01, IE 5.5, Firefox 1.5, Netscape 8, y Opera 9.

Ere un mostruo!!! (De resultón

)

Muchisimas gracias por tu ayuda, y espero que le pueda ser útil a más gente que pregunte por ello.

Un saludo a tod@s y gracias

Rafael · #8 (**permalink**) 21/09/2006, 23:36

El Javi; El retomar un post, haciendo una sencilla búsqueda (excelente el sistema de búsquedas, por cierto), en vez de pegar un post nuevo con el problema de uno, es creo, una manera de mantener la calidad de este excelente foro que nos apoya.

Kepawe, también voy a probar. Gracias.

el_javi · #9 (**permalink**) 22/09/2006, 04:57

Buenos días a tod@s de nuevo.

Lo primero... Rafael .. creo que sigo dormido.. con esto de estar de vacaciones... asi que si no te importa, explícame más lo que has querido decir en el post de antes.. porque no lo tengo muy claro...

... lo siento...

kepawe: He estado haciendo más pruebas y usando lo que posteaste.. y tengo una cosa que plantearte:
Todo funciona bien, como te dije probé en todos los navegadores que tengo instalados en mi máquina... ahora.

Haz una prueba cumpliendo las siguientes cosas:

1.- Pon la llamada a tu función en el onLoad del Body.
2.- Que tu documento tenga scroll.
3.- Que tu scroll esté desplazado X posiciones (vamos, que no esté arriba la barra de scroll)

En ese caso, en IE, no funciona...

Tengo mis dudas de si es porque: el Onload del Body, se ejecuta antes de recolocarse el Scroll de la página (todos sabemos que si tenemos el scroll desplazado, y recargamos la página, el scroll regresa a la posición que tenía antes...)

Entonces.. me gustaría saber si se os ocurre algo para que la función de nuestr@ amig@ kepawe funcione tambíen en el onLoad de la página.

Bueno, pues para que no tengáis que darle muchas vueltas al código, os dejo el que yo estoy usando, a ver si sacamos algo en claro

Código PHP:

  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
    <title>Sistema de Popup Layer</title>
    <script language="JavaScript1.2" type="text/javascript">
        function verTopScroll(moment)
        {
            if (window.pageYOffset)
            {
                scrollTop = window.pageYOffset;
            }
            else
            {
                scrollTop = Math.max(document.body.scrollTop, document.documentElement.scrollTop);
            }
            
            switch (moment)
            {
                case "load":
                    alert ("En el Load del documento, [scrollTop] vale " + scrollTop);
                break;
                
                case "click":
                    alert ("Al hacer Click en el enlace, [scrollTop] vale " + scrollTop);
                break;
            }
        }
    </script>
</head>

<body onload="verTopScroll('load')">
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>

<br><a href="javascript:void(null)" onclick="verTopScroll('click');">Pincha aqui</a>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>



</body>
</html>

En este código, podemos ver dos cosas:

1.- Que al cargar, te hace una alerta del ScrollTop (usando la función de kepawe), y nos da que es 0 (desplazar el scroll, y darle a recargar página, vereis como sigue dando 0)
2.- Que al pulsar en el enlace (que te obliga a que se desplace un poco el Scroll), saca una alerta del ScrollTop, y SI tiene valor

Espero que podamos resolverlo entre tod@s.

Un saludo a tod@s

kepawe · #10 (**permalink**) 22/09/2006, 08:11

Hola de nuevo. :)
Como bien dices, parece que no le da tiempo a IE a leer scrollTop, para solucionar el problema puedes retardar un poco la ejecución de la función.

Código:

<body onload="window.setTimeout('verTopScroll(\'load\')',100)">

Saludos

tunait · #11 (**permalink**) 23/09/2006, 04:23

Cita:

Iniciado por el_javi

Haz una prueba cumpliendo las siguientes cosas:

1.- Pon la llamada a tu función en el onLoad del Body.
2.- Que tu documento tenga scroll.
3.- Que tu scroll esté desplazado X posiciones (vamos, que no esté arriba la barra de scroll)

En ese caso, en IE, no funciona...

......

En este código, podemos ver dos cosas:

1.- Que al cargar, te hace una alerta del ScrollTop (usando la función de kepawe), y nos da que es 0 (desplazar el scroll, y darle a recargar página, vereis como sigue dando 0)
2.- Que al pulsar en el enlace (que te obliga a que se desplace un poco el Scroll), saca una alerta del ScrollTop, y SI tiene valor

mmmm el código que has dejado de ejemplo me funciona perfecto en IE6

Rafael · #12 (**permalink**) 23/09/2006, 10:22

El Javi tu pusiste:

Cita:

Gracias a tod@s por la atención que estais mostrando nuevamente en los post que se hacen

Mi post

Cita:

El retomar un post, haciendo una sencilla búsqueda ... bla bla

Es solo una reflexión al usar el foro de que los usuarios tratemos de retomar cadenas de posts del mismo tema. Perdón era una reflexión off-topic.

Ya in-topic, voy a adaptar las propuestas a mi script y les comento luego. Gracias.

Rafael · #13 (**permalink**) 23/09/2006, 12:05

Al Javi, a mi también me funciona como lo pusiste.
Probé el doctype xhtml 1 y también.

A ver, se me ocurre hacer un detector (no como el destripador de Caricatos, verdad) pero ya me entraron más dudas.

Código PHP:

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 
<html><head><title>Detector</title></head>

<body>

 
<script type="text/javascript" language="JavaScript1.5">

var Detectar1 = "NO";

var Detectar2 = "NO";

var Detectar3 = "NO";

var Detectar4 = "NO";

 
 
if (window.pageYOffset < 1) {

    Detectar1 = "SI";}

if (document.body.scrollTop < 1) {

    Detectar2 =  "SI";}

if (document.documentElement.scrollTop < 1) {

    Detectar3 =  "SI";}

 
if (document.all) {

    Detectar4 =  "SI";}

 
 
document.write(Detectar1 + " pageYOffset<br />");

document.write(Detectar2 + " document.body.scrollTop<br />");

document.write(Detectar3 + " document.documentElement.scrollTop<br />");

document.write(Detectar4 + " document.all<br />");

// --></script>

 
</body></html>

Mis dudas son:
1) Se usa por ejemplo
if (document.all) {bla bla}
Para evaluar si el JavaScript que está corriendo acepta esa sintáxis, función u lo que sea. ¿Por qué no me funciona poner solito
if (window.pageYOffset) {}
sino que tuve que evaluarlo contra < 1, para que "reconociera" la condición?

Mis otras dudas son ya con mi script. Al ratito las pongo.

Rafael · #14 (**permalink**) 23/09/2006, 18:17

Corrijo, el Script que pones El_Javi, cierto cuando recargas la página con el scroll abajo marca onload scroll 0

el_javi · #15 (**permalink**) 24/09/2006, 04:20

Cierto es Rafael. En el onLoad de la página, con el Scroll desplazado, marca que el Top es 0

No he tenido tiempo para probar lo que decía nuestr@ amig@ kepawe, lo de ponerle un retardo en el onLoad del documento, para darle tiempo a posicionar el Scroll en Internet Explorer.

Quería daros las gracias a tod@s por la atención que le habéis dado a este post.

Un abrazo a tod@s.