prevent scroll module

by Yunus Gaziev

HTML

<div class="scroller-block scroller-block_first">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci, tempora repellat numquam. Impedit et eaque excepturi incidunt suscipit cumque eum beatae numquam, repellat. Numquam, laudantium.</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci, tempora repellat numquam. Impedit et eaque excepturi incidunt suscipit cumque eum beatae numquam, repellat. Numquam, laudantium.</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci, tempora repellat numquam. Impedit et eaque excepturi incidunt suscipit cumque eum beatae numquam, repellat. Numquam, laudantium.</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci, tempora repellat numquam. Impedit et eaque excepturi incidunt suscipit cumque eum beatae numquam, repellat. Numquam, laudantium.</p>
</div>

<div class="scroller-block scroller-block_second">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci, tempora repellat numquam. Impedit et eaque excepturi incidunt suscipit cumque eum beatae numquam, repellat. Numquam, laudantium.</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci, tempora repellat numquam. Impedit et eaque excepturi incidunt suscipit cumque eum beatae numquam, repellat. Numquam, laudantium.</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci, tempora repellat numquam. Impedit et eaque excepturi incidunt suscipit cumque eum beatae numquam, repellat. Numquam, laudantium.</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci, tempora repellat numquam. Impedit et eaque excepturi incidunt suscipit cumque eum beatae numquam, repellat. Numquam, laudantium.</p>
</div>

<div class="scroller-block scroller-block_third">
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Adipisci, tempora repellat numquam. Impedit et eaque excepturi incidunt suscipit cumque eum beatae...

CSS

body {
    padding: 15px !important;
    font-family: Ubuntu, Roboto, "Segoe UI", Arial, Helvetica, sans-serif;
}

.scroller-block {
    position : fixed;
    background-color: #000;
    color: #fff;
    top : 15px;
    left : 15px;
    width : 320px;
    height : 240px;
    overflow : auto;
    padding: 15px;
    box-shadow: 0 0 32px rgba(0,0,0, .5);
    box-sizing: border-box;
    -webkit-overflow-scrolling : touch; /* for iOs inertion scroll */
}

.scroller-block_second {
    left: 350px;
}

.scroller-block_third {
    top: 270px;
}

JavaScript

;(function(root, factory) {

    'use strict';

    if (typeof define === 'function' && define.amd) {
        // AMD. Register as an anonymous module.
        define([], factory);
    } else if (typeof exports === 'object') {
        // COMMONJS
        module.exports = factory();
    } else {
        // BROWSER
        root.Preventer = factory();
    }

} (this, function() {

    'use strict';

    /**
     * Check if object is part of the DOM
     * @constructor
     * @param {Object} obj element to check
     */
    function isDOMElement(obj) {
        return obj && typeof window !== 'undefined' && (obj === window || obj.nodeType);
    }

    /**
     * Helper function for extending objects
     */
    function extend(object /*, objectN ... */ ) {

        if (arguments.length <= 0) {
            throw new Error('Missing arguments in extend function');
        }

        var result = object || {},
            key,
            i;

        for (i = 1; i < arguments.length; i++) {

            var replacement = arguments[i] || {};

            for (key in replacement) {
                // Recurse into object except if the object is a DOM element
                if (typeof result[key] === 'object' && !isDOMElement(result[key])) {
                    result[key] = extend(result[key], replacement[key]);
                } else {
                    result[key] = result[key] || replacement[key];
                }
            }
        }

        return result;
    }

    function Preventer(elem, options) {

        options = extend(options, Preventer.options);

        this.initialized     = false;
        this.elem            = elem;
        this.scrollDiff      = 0
        this.wheelDelta      = 0;
        this.scrollTop       = 0;
        this.onInit          = options.onInit;
        this.onUpdate        = options.onUpdate;
        this.onWheel         = options.onWheel;
        this.onPreventTop    = options.onPreventTop;
        this.preventTop      = false;
   ...