Torna all'inizio del div scorrevole

<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;

Come reimpostare la posizione di scorrimento all'inizio del div contenitore la prossima volta?

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

Vedi l' scrollTopattributo.

Un altro modo per farlo con un'animazione fluida è questo

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

Ho provato le risposte esistenti a questa domanda e nessuna di esse ha funzionato su Chrome per me. Quello che ha funzionato era leggermente diverso:

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

scrollTo

window.scrollTo(0, 0);

è la soluzione definitiva per scorrere le finestre verso l'alto - la parte migliore è che non richiede alcun selettore di id e anche se usiamo la struttura IFRAME funzionerà molto bene.

Il metodo scrollTo () scorre il documento fino alle coordinate specificate.
window.scrollTo (xpos, ypos);
Numero xpos obbligatorio. La coordinata su cui scorrere, lungo l'asse x (orizzontale), in pixel
Numero ypos Richiesto. La coordinata su cui scorrere, lungo l'asse y (verticale), in pixel

jQuery

Un'altra opzione per fare lo stesso è usare jQuery e darà un aspetto più liscio per lo stesso

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

dove 0 dopo scrollTop specifica la posizione della barra di scorrimento verticale nel pixel e il secondo parametro è un parametro opzionale che mostra il tempo in microsecondi per completare l'operazione.

Questo ha funzionato per me:

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

Per coloro che ancora non riescono a farlo funzionare, assicurarsi che l'elemento in overflow sia visualizzato prima di utilizzare la funzione jQuery .

Esempio:

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

Per me il modo scrollTop non ha funzionato, ma ne ho trovati altri:

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

Non è stato verificato il tempo minimo per un rendering CSS affidabile, 100 ms potrebbero essere eccessivi.

Se vuoi scorrere con una transizione graduale, puoi usare questo!

(Vaniglia JS)

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

Se i tuoi utenti target sono Chrome e Firefox , allora va bene! Ma sfortunatamente questo metodo non è supportato abbastanza bene su tutti i browser. Controlla qui

Spero che questo ti aiuti!!

Come da risposta di François Noël "Per coloro che ancora non riescono a farlo funzionare, assicurarsi che l'elemento in overflow sia visualizzato prima di utilizzare la funzione jQuery."

Stavo lavorando in un modal bootstrap che ho ripetutamente visualizzato con le autorizzazioni dell'account in un div che trabocca sulla dimensione y. Il mio problema era che stavo cercando di utilizzare la funzione jquery .scrollTop (0) e non avrebbe funzionato indipendentemente da come avessi provato a farlo. Ho dovuto impostare un evento per il modale che non ripristinava la barra di scorrimento fino a quando il modale non aveva smesso di animarsi. Il codice che alla fine ha funzionato per me è qui:

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

Se il contenuto html trabocca di una singola visualizzazione, questo ha funzionato per me utilizzando solo javascript:

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

Saluti,

Questo è l'unico modo in cui ha funzionato per me, con una transizione di scorrimento fluida:

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

Quando si ottiene un elemento in base al nome della classe, non dimenticare che il valore restituito è un array; Da qui questo codice:

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

Non funzionerebbe. Usa invece il codice qui sotto.

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

Ho pensato che altre persone avrebbero potuto incontrare un problema simile a me; quindi questo dovrebbe fare il trucco.

questi due codici hanno funzionato per me come un fascino che questo primo richiederà per scorrere fino all'inizio della pagina, ma se vuoi scorrere fino a qualche div specifico usa il secondo con il tuo div id.

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

Se desideri scorrere fino al nome di una classe, utilizza il codice seguente

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

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

L'ID dovrebbe avere l'ID del div corrispondente che ha la proprietà CSS di overflow.

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