Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/pedrouid/scroll-control
Easy-to-use jQuery script for smooth scrolling between sections
https://github.com/pedrouid/scroll-control
Last synced: 13 days ago
JSON representation
Easy-to-use jQuery script for smooth scrolling between sections
- Host: GitHub
- URL: https://github.com/pedrouid/scroll-control
- Owner: pedrouid
- Created: 2017-06-10T20:55:03.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2018-09-02T13:12:07.000Z (over 6 years ago)
- Last Synced: 2024-10-28T23:40:45.040Z (2 months ago)
- Language: JavaScript
- Size: 34.2 KB
- Stars: 0
- Watchers: 3
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## Scroll Control
A jQuery script for smooth scrolling between sections, identifies height and distance from top.
Easy to use and can be applied to any eventListeners.## Pre-Requisites
`jQuery`
you can download from http://jquery.com/ or using Google's hosted libraries at https://developers.google.com/speed/libraries/#jquery## How to install
Download the scrollControl.js and add script tag to your website
(don't forget to always put jQuery before the script tag)Then on your main .js file, set the sections after the DOM fully loads
```
// Scroll Control sections
var scrollControl = ScrollControl([
'#section1',
'#section2',
'#section3',
'#section4'
]);
```Finally set the event listeners for the smooth scroll
```
// Up and Down Arrow Keys
$(document).keydown(function(e) {
if (e.which==38) { //
e.preventDefault();
scrollControl.prevSection();
} else if (e.which==40) {
e.preventDefault();
scrollControl.nextSection();
}
});
```That's it, you're done!
Enjoy!