Vuelve a la parte superior del div desplazable

<div id="containerDiv"></div>

#containerDiv {
  position: absolute;
  top: 0px;
  width: 400px;
  height: 100%;
  padding: 5px;
  font-size: .875em;
  overflow-y: scroll;
}

document.getElementById("containerDiv").innerHTML = variableLongText;

¿Cómo restablecer la posición de desplazamiento hacia la parte superior del contenedor div la próxima vez?

var myDiv = document.getElementById('containerDiv');
myDiv.innerHTML = variableLongText;
myDiv.scrollTop = 0;

Vea el scrollTopatributo.

Otra forma de hacerlo con una animación suave es así.

$("#containerDiv").animate({ scrollTop: 0 }, "fast");

Probé las respuestas existentes a esta pregunta, y ninguna de ellas funcionó en Chrome para mí. Lo que funcionó fue ligeramente diferente:

$('body, html, #containerDiv').scrollTop(0);

scrollTo

window.scrollTo(0, 0);

es la solución definitiva para desplazar las ventanas hacia la parte superior; la mejor parte es que no requiere ningún selector de ID e incluso si usamos la estructura IFRAME, funcionará extremadamente bien.

El método scrollTo () desplaza el documento a las coordenadas especificadas.
window.scrollTo (xpos, ypos);
Número de xpos requerido. La coordenada a la que desplazarse, a lo largo del eje x (horizontal), en píxeles
ypos Número requerido. La coordenada a la que desplazarse, a lo largo del eje y (vertical), en píxeles

jQuery

Otra opción para hacer lo mismo es usar jQuery y le dará un aspecto más suave al mismo

$('html,body').animate({scrollTop: 0}, 100);

donde 0 después de scrollTop especifica la posición de la barra de desplazamiento vertical en el píxel y el segundo parámetro es un parámetro opcional que muestra el tiempo en microsegundos para completar la tarea.

Esto funcionó para mí:

document.getElementById('yourDivID').scrollIntoView();

Para aquellos que aún no pueden hacer que esto funcione, asegúrese de que el elemento desbordado se muestre antes de usar la función jQuery .

Ejemplo:

$('#elem').show();
$('#elem').scrollTop(0);

Para mí, la forma scrollTop no funcionó, pero encontré otra:

element.style.display = 'none';
setTimeout(function() { element.style.display = 'block' }, 100);

Sin embargo, no verifiqué el tiempo mínimo para una representación css confiable, 100 ms podría ser excesivo.

Si desea desplazarse con una transición suave, ¡puede usar esto!

(Vanilla JS)

const tabScroll = document.getElementById("tabScroll");
window.scrollTo({
  'behavior': 'smooth',
  'left': 0,
  'top': tabScroll.offsetTop - 80
});

Si sus usuarios objetivo son Chrome y Firefox , ¡esto es bueno! Pero, lamentablemente, este método no es lo suficientemente compatible con todos los navegadores. Chequea aquí

¡¡Espero que esto ayude!!

Según la respuesta de François Noël "Para aquellos que aún no pueden hacer que esto funcione, asegúrese de que el elemento desbordado se muestre antes de usar la función jQuery".

Había estado trabajando en un modal de arranque que menciono repetidamente con permisos de cuenta en un div que se desborda en la dimensión y. Mi problema era que estaba tratando de usar la función jquery .scrollTop (0) y no funcionaría sin importar cómo intentara hacerlo. Tuve que configurar un evento para el modal que no restableció la barra de desplazamiento hasta que el modal dejó de animarse. El código que finalmente funcionó para mí está aquí:

    $('#add-modal').on('shown.bs.modal', function (e) {
        $('div.border').scrollTop(0);
    });

Si el contenido html desborda una sola ventana gráfica, esto funcionó para mí usando solo javascript:

document.getElementsByTagName('body')[0].scrollTop = 0;

Saludos,

Esta es la única forma en que funcionó para mí, con una transición de desplazamiento suave:

  $('html, body').animate({
    scrollTop: $('#containerDiv').offset().top,
  }, 250);

Cuando obtenga un elemento por nombre de clase, no olvide que el valor de retorno es una matriz; De ahí este código:

document.getElementByClassName("dropdown-menu").scrollTop = 0

No funcionaría. En su lugar, utilice el código siguiente.

document.getElementByClassName("dropdown-menu")[0].scrollTop = 0

Supuse que otras personas podrían encontrar un problema similar al mío; así que esto debería funcionar.

estos dos códigos funcionaron para mí como un encanto, este primero tomará para desplazarse a la parte superior de la página, pero si desea desplazarse a algún div específico, use el segundo con su id de div.

$('body, html, #containerDiv').scrollTop(0);
document.getElementById('yourDivID').scrollIntoView();

Si desea desplazarse por el nombre de una clase, use el siguiente código

var $container = $("html,body");
var $scrollTo = $('.main-content');

$container.animate({scrollTop: $scrollTo.offset().top - $container.offset().top + $container.scrollTop(), scrollLeft: 0},300);

El ID debe tener el ID del div correspondiente que tiene la propiedad overflow css.

document.querySelector('#YOUR_OVERFLOWED_DIV').scrollTop = 0;