Scroll up

HTML

<p>This code works in Chrome, by using <code> elem.scroll(0,0)</code> combined also with <code> elem {scroll-behavior: smooth;}</code> in order to improve the UX by some fluid scroll appearance.</p>

<ul>
	<li>Lorem</li> 
    <li>Ipsum</li>
    <li>Dolor</li>
    <li>Sit</li>
    <li>Amet,</li>
    <li>Consectetur</li>
    <li>Adipiscing</li>
    <li>Elit.</li>
    
    <li>Praesent</li>
    <li>Quis</li>
    <li>Feugiat</li>
    <li>Purus.</li>
    
    <li>Donec</li>
    <li>Euismod</li>
    <li>Tristique</li>
    <li>Porta.</li>
    
    <li>Pellentesque</li>
    <li>Habitant</li>
    <li>Morbi</li>
    <li>Tristique.</li>
</ul>

<p>You can scroll down the list above then click this <button onclick="thelist.scroll(0,0)">Button</button> to scroll up again.</p>

<p>Likewise, you can scroll down the entire page then click this <button onclick="window.scroll(0,0)">Second Button</button> to scroll up again.</p>

CSS

body { height: 850px; }

ul { height: 250px; overflow: auto; background-color: #cccccc; }

code { background-color: #cccccc; }

ul li:nth-child(2n+1) { color: red; }

ul li:nth-child(2n) { color: blue; }

html, ul { scroll-behavior: smooth; }

JavaScript

let thelist = document.querySelector("ul");