Stop iOS scrolling during intertia / momentum

by Slava Fomin II

HTML

<button class="scrollTop">Stop & Scroll top</button>

<hr />

<div class="scroll"></div>

CSS

body {
  padding: 20px;
}

div.scroll {
	width:						280px;
	height:						200px;
	padding:					10px;
	border:						1px solid grey;
	overflow-y:					scroll;
	-webkit-overflow-scrolling:	touch;
    white-space:                 pre;
}

JavaScript

$(document).ready(function () {

  var scrollableElement = document.querySelector('.scroll');
  var scrollTop = document.querySelector('.scrollTop');

  for (var i = 1; i <= 1000; i++) {
    scrollableElement.innerHTML += i + '\n';
  }

  scrollTop.addEventListener('click', function() {
    const previousOverflowValue = scrollableElement.style.overflow;
    scrollableElement.style.overflow = 'hidden';
    scrollableElement.scrollTop = 0;
    setTimeout(() => (scrollableElement.style.overflow = previousOverflowValue), 0);
  });
    
});