JS: disable OSX elastic scrolling

http://stackoverflow.com/a/22594348/1250044

by Yannick Albert

CSS

html, body {
    height: 200%;
}

JavaScript

var enabled = true;
var scrollMinX = 0;
var scrollMinY = 0;
var scrollMaxX = document.body.scrollWidth - window.innerWidth;
var scrollMaxY = document.body.scrollHeight - window.innerHeight;

// toggles between "enabled / disabled"
document.onclick = function () {
    enabled = !enabled;
};

// make sure that we work with the correct dimensions
window.onresize = function () {
    scrollMaxX = document.body.scrollWidth - window.innerWidth;
    scrollMaxY = document.body.scrollHeight - window.innerHeight;
};

// where the magic happens
document.onscroll = function () {
    if (!enabled) return;

    if (window.scrollX <= scrollMinX) scrollTo(scrollMinX, window.scrollY);
    if (window.scrollX >= scrollMaxX) scrollTo(scrollMaxX, window.scrollY);
    
    if (window.scrollY <= scrollMinY) scrollTo(window.scrollX, scrollMinY);
    if (window.scrollY >= scrollMaxY) scrollTo(window.scrollX, scrollMaxY);
};