CSS3 Translate Scroller

css3.scroller.js

function windowScrollToCSS(_config, _callback) {
    var current, target, windowFinalY = 0,
        defaults = {
            to: 0,
            scrollTime: 1.5,
            easing: Power2.easeInOut,
            delay: 0,
            menu: true,
            element: false,
            force: false,
            offset: globals.scrollbarheight,
            threshold: 200,
        };
    var viewEl = document.getElementsByClassName('ng-view-container')[0],
        footerEl = document.getElementsByTagName('footer')[0];        
    
    for(var key in _config)
        if(_config.hasOwnProperty(key))
            defaults[key] = _config[key];

    if (defaults.menu) {
        defaults.offset = globals.scrollbarheight;
    }

    var onStartCallback = function() {
        console.log('%c Using CSS translate scroll ', 'background: lime; color: black;')
        document.body.classList.add('hover-disabled');
        globals.scrolling = true;

        var viewportspace = window.innerHeight,
        documentspace = document.body.clientHeight;

        console.log('Dom element has been set?', defaults.element);
        current = window.pageYOffset;
        if (defaults.element !== false) {
            var elementRect = defaults.element.getBoundingClientRect();
            target = (elementRect.top - defaults.offset)*-1;
            windowFinalY = current + (target*-1);
            console.log('%c Calculated from element, values ', 'background: lime; color: black;', 'element at', elementRect.top, 'current Y', current, 'amount to translate', target);
        }
        else {
            target = current - (defaults.to - defaults.offset);    
            windowFinalY = (defaults.to - defaults.offset);
            console.log('%c Simple scrolling, values ', 'background: lime; color: black;', 'current Y', current, 'amount to translate', target);
        }

        if (defaults.force === false) {
            // Boundary screen limit
            // If force is set to true then it instructs the translate to go over the maximum screen size
            if ((windowFinalY + viewportspace) > documentspace)
                target = current - (documentspace - viewportspace);
        
            if (current - target < 0)
                target = current;
                
        }                    
        
        console.log('%c Window values', 'background: lime; color: black;', 'viewport', viewportspace, 'document', documentspace);

        if (Math.abs(target) <= defaults.threshold) {
            defaults.scrollTime = Math.abs(target) / 500;
            console.log('%c Scroll within threshold, speeding up. New scrolltime is ', 'background: lime; color: black;', defaults.scrollTime);
        }

        
    };

    var onCompleteCallback = function() {
        if (typeof _callback == 'function') {
            _callback();
        }
        globals.scrolling = false;
        document.body.classList.remove('hover-disabled');
        
        console.log('%c End translate scroll ', 'background: lime; color: black;')
    };

    // Start
    setTimeout(function() {
        onStartCallback();

        for (var i = vendorTransitionStyle.length - 1; i >= 0; i--) {
            viewEl.style[ vendorTransitionStyle[i] ] = vendorPrefix[i] + 'transform '+defaults.scrollTime+'s ease-in-out';
            footerEl.style[ vendorTransitionStyle[i] ] = vendorPrefix[i] + 'transform '+defaults.scrollTime+'s ease-in-out';
        }
          
        for (var i = vendorTransformStyle.length - 1; i >= 0; i--) {
            viewEl.style[ vendorTransformStyle[i] ] = 'translateY('+target+'px)';
            footerEl.style[ vendorTransformStyle[i] ] = 'translateY('+target+'px)';
        }

        // End Timeout
        setTimeout(function() {

            for (var i = vendorTransitionStyle.length - 1; i >= 0; i--) {
                viewEl.style[ vendorTransitionStyle[i] ] = '';
                footerEl.style[ vendorTransitionStyle[i] ] = '';
            }

            for (var i = vendorTransformStyle.length - 1; i >= 0; i--) {
                viewEl.style[ vendorTransformStyle[i] ] = '';
                footerEl.style[ vendorTransformStyle[i] ] = '';
            }
            
            window.scrollTo(0, windowFinalY);

            console.log('%c Finalizing windowScrollToCSS at', 'background: lime; color: black;', windowFinalY);

            onCompleteCallback();

        }, (defaults.scrollTime*1000)+50 ); 

    }, (defaults.delay*1000) );

}

css3.vendors.js

var vendorTransformStyle = [
    "webkitTransform",
    "MozTransform",
    "msTransform",
    "OTransform",
    "transform"
];
var vendorTransitionStyle = [
    "webkitTransition",
    "MozTransition",
    "msTransition",
    "OTransition",
    "transition"
];
var vendorPrefix = [
    "-webkit-",
    "-moz-",
    "-ms-",
    "-o-",
    ""
];

gsap.fallback.js

function windowScrollTo(_config, _callback) {
    var current, target, offset = globals.scrollbarheight,
        defaults = {
            to: 0,
            scrollTime: 1.5,
            easing: Power2.easeInOut,
            delay: 0,
            menu: true,
            element: false
        };
    
    for(var key in _config)
        if(_config.hasOwnProperty(key))
            defaults[key] = _config[key];        

    if (!defaults.menu) {
        offset = 0;
    }
    
    
    var onStartCallback = function() {
        console.log('%cUsing windowScrollTo function.', 'background: lime; color: black;')
        document.body.classList.add('hover-disabled');
        globals.scrolling = true;

        console.log('Dom element has been set?', defaults.element);
        
        if (defaults.element !== false) {
            var elementPosition = defaults.element.offsetTop;
            target = (elementPosition - offset);
        }
        else {
            target = (defaults.to - offset);    
        }

        // Boundary screen limit
        if (target + viewportspace > documentspace)
            target = documentspace - viewportspace;
    
        if (current - target < 0)
            target = 0;

        console.log('Window info:', current, target);

    }

    var onCompleteCallback = function() {
        if (typeof _callback == 'function') {
            _callback();
        }
        
        globals.scrolling = false;
        document.body.classList.remove('hover-disabled');
        console.log('%c End javascript scroll ', 'background: lime; color: black;')
    }

    TweenMax.to(window, defaults.scrollTime*60, {
        scrollTo : { 
            y: target,
            autoKill: true
        },
        ease: defaults.easing,
        delay: defaults.delay*60,
        overwrite: 5,
        useFrames: true,
        onStart: onStartCallback,
        onComplete: onCompleteCallback,

    });     
}