How to make a smooth scrolling effect using javascript

Question

I've been looking everywhere and I cannot find an answer for this specific need.

I want to create a page with this effect - I want the page to scroll down automatically and smoothly to a certain section on the page as soon as the user begins to scroll their mouse. The problem with using the plugin linked above is that I already have my page designed the way I want, I just want to implement this scrolling effect. I am by no means a javascript expert - I deal mainly with the layout aspects of web. But if someone could show me how I could use javascript to automatically drop to a certain section on the page when the user begins to scroll, I would GREATLY appreciate it. Thank you!

"the user begins to scroll their mouse" - Do you mean with the mouse wheel specifically? What if the user scrolls by clicking the scrollbar buttons, or by pressing the down arrow key or spacebar? — nnnnnn
– nnnnnn, Commented Oct 25, 2017 at 2:15
Evan, using that plugin would be easier than anything we can suggest. There is no magical way for javascript to achieve it, that is why there are plugins for it, because it is not easy. — user8811940
– user8811940, Commented Oct 25, 2017 at 2:17
The following post should point you in the direction you're looking for - stackoverflow.com/questions/21450095/… - but as stated previously, the reason these plugins exist is because they are difficult to create (especially when new to javascript) — Mike Diglio
– Mike Diglio, Commented Oct 25, 2017 at 2:41

Rushabh Sheth · Accepted Answer · 2017-10-25 04:26:06Z

1

Try Using Nice Scroll

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.nicescroll/3.7.6/jquery.nicescroll.min.js"></script>

$("#thisdiv").niceScroll({
    mousescrollstep: 40, // scrolling speed with mouse wheel (pixel)
});

answered Oct 25, 2017 at 4:26

Rushabh Sheth

1771 silver badge8 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to make a smooth scrolling effect using javascript

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related