scrollBy buttons

programmatically scroll a div by buttons

HTML

<div id="nyedva" class="list1">
nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva nyedva 
</div>
<button id="up" onclick="scrollup('.list1')">
scroll up
</button>
<button id="down" onclick="scrolldown('.list1')">
scroll down
</button>

CSS

#nyedva { background: cyan; width: 100px; margin: 100px; height: 200px; overflow: auto; }

JavaScript

function scrollup(selector) {
  const items = document.querySelectorAll(selector);
  for (const item of items) {
    const scrollAmount = (item.clientHeight-20);
  	item.scrollBy(0,-scrollAmount);
	}
}
function scrolldown(selector) {
  const items = document.querySelectorAll(selector);
  for (const item of items) {
    const scrollAmount = (item.clientHeight-20);
    item.scrollBy(0,scrollAmount);
  }
}