JSFiddle - React, Tailwind, and code Playground
HTML
<div>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quod ratione minus officia praesentium dolorem optio placeat eum veniam. Repudiandae voluptates nobis necessitatibus iusto quas deleniti repellat animi praesentium! Saepe inventore eveniet totam sed obcaecati odio nesciunt repellendus impedit quae perspiciatis aliquam sit et officia veniam amet! Praesentium error earum suscipit facere tenetur aliquid enim dolorem soluta a culpa dignissimos perspiciatis quod esse ullam animi ipsa necessitatibus adipisci perferendis iusto ea. Quam deserunt reiciendis impedit quis rem voluptatem repudiandae sapiente vero odit illum vitae quasi placeat? Adipisci dolorem earum reprehenderit voluptatibus eum ipsum perferendis accusamus in alias perspiciatis consectetur eveniet modi unde blanditiis quae odio fugiat ipsam repudiandae suscipit officia minus autem dolores possimus ab quas sunt quibusdam commodi totam delectus. Illum inventore maxime explicabo quae dignissimos iusto non eveniet beatae nemo ipsa quia fuga sit accusamus doloribus quis veritatis maiores earum exercitationem aliquid minima repudiandae officiis ea minus dolore odio iure voluptatem eum ratione quisquam asperiores harum facilis reprehenderit amet labore quaerat tempora culpa? Nam magnam illum libero placeat explicabo asperiores nemo deleniti natus mollitia obcaecati fugit culpa ab neque nesciunt blanditiis praesentium repudiandae ullam odit saepe eligendi atque dignissimos aperiam eum tenetur impedit voluptas commodi totam excepturi soluta quibusdam at voluptatum est et sapiente enim alias quaerat quia! Fugit itaque possimus eaque molestiae. Molestiae ducimus cumque nulla omnis aspernatur ipsum molestias ad necessitatibus consectetur esse. Culpa distinctio ex illum rerum nostrum dolorum quas qui. Tempora impedit eum velit delectus veritatis sit magnam voluptatibus quibusdam omnis laboriosam id in quia nam error laudantium itaque ratione culpa? Doloremque labore minima error dolorum ut atque...
CSS
div {
background-color: blue;
width: 300px;
}
JavaScript
var animatingScroll;
$(window).on('scroll', function () {
if (animatingScroll) {
return;
}
console.log('wat');
});
animatingScroll = true;
$('html, body').animate({'scrollTop': 500}, 3000).promise().done(function () {
animatingScroll = false;
});