How to scroll to top inside a div element?

How to scroll to top inside a div element? Consider the example below.

We have two div tags,a wraper div and a content div inside and one button for handle an event:



Add a little bit of Css codes to make a scrollbar inside the div:
#wrp {
  height: 300px;
  width: 300px;
  overflow: auto;
  text-align: center;
}

#content {
  height: 2050px;
}


Finally, create a function called scrollToTop to handle scroll top event:
function scrollToTop() {
  const el = document.getElementById("wrp");
  el.scrollTop = 0;
}


That's it, now you can click the click me button to see the result.

htmljavascriptscroll top divscrolltop

© 2019 4codev

Created with love by Sil.