Nov 20, 2022

# Solution 1 :

Welcome to SO.

This effect is called Smooth Scroll.

Add the below code before closing the body tag.

`````` <script>
window.onmousewheel = document.onmousewheel = wheel;

function wheel(event) {
var delta = 0;
if (event.wheelDelta) delta = event.wheelDelta / 40; //controls the scroll wheel range/speed
else if (event.detail) delta = -event.detail / 40;

handle(delta);
if (event.preventDefault) event.preventDefault();
event.returnValue = false;
}

var goUp = true;
var end = null;
var interval = null;

function handle(delta) {
var animationInterval = 20; //controls the scroll animation after scroll is done
var scrollSpeed = 20; //controls the scroll animation after scroll is done

if (end == null) {
end = \$(window).scrollTop();
}
end -= 20 * delta;
goUp = delta > 0;

if (interval == null) {
interval = setInterval(function () {
var scrollTop = \$(window).scrollTop();
var step = Math.round((end - scrollTop) / scrollSpeed);
if (scrollTop <= 0 ||
scrollTop >= \$(window).prop("scrollHeight") - \$(window).height() ||
goUp && step > -1 ||
!goUp && step < 1 ) {
clearInterval(interval);
interval = null;
end = null;
}
\$(window).scrollTop(scrollTop + step );
}, animationInterval);
}
}
</script>
``````

https://www.w3schools.com/howto/howto_css_smooth_scroll.asp

https://css-tricks.com/snippets/jquery/smooth-scrolling/

https://www.cssscript.com/tag/smooth-scroll/

# Problem :

I have been learning css and javascript these few days and came across a scrolling effect it this website(https://jnby.jp/).
I am not even sure how this effect is called so I have no success on googling it.

Could I ask how is this achieved? Or how is this called?

Thank you

### Comment posted by forum.webflow.com/t/slow-down-scrolling/74950

Welcome to stackoverflow, have you tried searching “slow down scrolling javascript” because that brought me to this site: