¿Alguna alternativa en javascript puro?
Los siguientes trabajos en ópera, cromo y safari. No he probado todavía en el explorador:
http://monkey-me.herokuapp.com
https://github.com/coolcatDev/monkey-me-heroku/blob/master/static/js/myscripts.js
Al cargar la página, debe desplazarse hacia abajo hasta div '.content':
var destiny = document.getElementsByClassName('content'); var destinyY = destiny[0].offsetTop; scrollTo(document.body, destinyY, 200); function scrollTo(element, to, duration) { if (duration <= 0) return; var difference = to - element.scrollTop; var perTick = difference / duration * 2; setTimeout(function() { element.scrollTop = element.scrollTop + perTick; scrollTo(element, to, duration - 2); }, 10); };Intente usar esto: document.documentElement.scrollTop . Si estoy en lo correcto document.body.scrollTop está en desuso.
Actualizar
Parece que Chrome no sigue el juego con la respuesta, para ser un uso seguro como lo sugiere @Nikolai Mavrenkov en los comentarios:
window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0
Ahora todos los navegadores deberían estar cubiertos.
En lugar de usar condiciones IF , hay una manera más fácil de obtener el resultado adecuado usando algo como esta expresión lógica.
var bodyScrollTop = document.documentElement.scrollTop || document.body.scrollTop;Ambas partes devuelven cero de forma predeterminada, por lo que cuando su desplazamiento esté en la posición cero, devolverá cero como se esperaba.
bodyScrollTop = 0 || 0 = 0 En el desplazamiento de página, una de esas partes devolverá cero y otra devolverá un número mayor que cero. El valor puesto a cero se evalúa como falso y luego lógico O || tomará otro valor como resultado (por ejemplo, su scrollTop esperado es 300 ).
Los navegadores tipo Firefox verán esta expresión como
bodyScrollTop = 300 || 0 = 300y resto de navegadores ver
bodyScrollTop = 0 || 300 = 300que de nuevo da el mismo y correcto resultado.
De hecho, se trata de something || nothing = something :)
El estándar es document.documentElement y lo utilizan FF e IE.
WebKit usa document.body y no pudo usar el estándar debido a las quejas sobre la compatibilidad con versiones anteriores si cambiaron al estándar, esta publicación lo explica muy bien
https://miketaylr.com/posts/2014/11/document-body-scrolltop.html
Hay una nueva propiedad en el documento que WebKit ahora admite
https://developer.mozilla.org/en/docs/Web/API/document/scrollingElement
así que esto te llevará al elemento correcto
var scrollingElement = document.scrollingElement || document.documentElement; scrollingElement.scrollTop = 100;y también hay un polyfill