Smooth scrolling for webpages

This will show you a simple script to create a smooth scrolling effect. This is especially handy when working with animations which utilize scrolling (eg: parallax). Try scrolling and comparing it to that of a website without smooth scrolling (please note that this is kind of pointless if most of your users already have smooth-scrolling built-into their browsers...still comes in handy for those who don't though).


Implementing the control

1. Download the smooth.js file and upload it to your server (eg: In the same place where your index.html file is stored).
2. Link to the smooth.js file from your server in the preferred page where you want smooth scrolling to function (eg: In the head portion of your index.html file), like this:

<scrlpt src="http://myserver.com/smooth.js"></scrlpt>

Small tip: It's always best to place scripts at the very bottom of your web-page to reduce page-load times.


Using the code

That's it! No need for any extra coding! Simply link to the smooth.js file as shown above from the page where you want smooth scrolling to function.

Overview

This is a great little feature which can help make your site feel of a much higher quality.

I hope you found this article interesting! 1f609

Smooth Scrolling.zip 4.42KB, 2 download(s) since 2017-12-01 

   You don't have the permssion to download the attachments of this post.

Like 0 Dislike