When creating my personal site in 2016, fullscreen scrolling websites were all the rage. However, none of the open-source libraries available were what I was looking for; fullPage by Alvaro Trigo came close, but did not allow the centering of elements less than the height of the viewport. So I decided to create my own snap scrolling JavaScript library, snapScroll.js.
SnapScroll.js was built as a jQuery plugin, in order to use jQuery’s scrollTo function. It revolves around adding snap points throughout the page, added via a data-snap-point attribute, which determines the scrolling flow of the page. Custom jQuery easings enable the possibility of quirky scrolling, such as a bouncing effect at the bottom of the page.
SnapScroll.js was kindly supported by BrowserStack, in order to test browser support and find any problems with the scroll detection. SnapScroll.js supports the following browsers:
- Chrome ≥ 26
- Firefox ≥ 21
- Edge ≥ 14
- Opera ≥ 15
- Safari ≥ 6.2
- Internet Explorer not supported