JSFiddle - React, Tailwind, and code Playground

by jpeter06

HTML

<div class="scrolled"  id="scrolled">
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
asdf  asdf asdf <br>
</div>

CSS

.scrolled{
  width:200px;
  height:200px;
  background:tan;
  overflow:auto;
  scroll-behavior: auto;
  transition: none !important;
    transform: none !important;
    animation-duration: unset !important;
}

JavaScript

let elem = document.getElementById("scrolled");
//elem.addEventListener("wheel",treatScroll)
elem.addEventListener("scroll",treatScroll2)


function treatScroll(event){
	console.log("asdf")
}

var cont=0;
function treatScroll2(event){
	console.log("xxx",cont);
  cont++;
  event.preventDefault();
}