JavaScript: Parallax with Scale and Blur

JavaScript: Parallax with Scale and Blur.js

// Parallax

$(document).ready(function(){
    parallax();

    $window = $(window);
    
    $window.scroll(function() {
        parallax();
    });
    
    $(window).bind('resize', function () {
        parallax();
    });
});

function parallax(){
    $window = $(window);
    var width = $window.width();
    
    var scrollSpeed = -3;
    var scaleSpeed = 4;
    var opacitySpeed = 11;
    var blurSpeed = 8;
    
    if (width <= 640) {
        scrollSpeed = -2;
        scaleSpeed = 6;
        opacitySpeed = 14;
    }

    var position = $window.scrollTop();
    var translateY = position / scrollSpeed;
    var translateX = 0;
    var scale = 1 + (position * scaleSpeed / Math.pow(10, 4));
    var opacity = 1 - (position * opacitySpeed / Math.pow(10, 4));

    if (width > 640) {
        var blur = Math.pow(position, 3) * blurSpeed / Math.pow(10, 9);
        $('.contest-background').css({ 'transform': 'translate3d(' + translateX +'px, ' + translateY + 'px, 0) scale(' + scale + ')', 'opacity' : opacity, '-webkit-filter' : 'blur(' + blur + 'px)', '-moz-filter' : 'blur(' + blur + 'px)', '-ms-filter' : 'blur(' + blur + 'px)', 'filter' : 'blur(' + blur + 'px)' });
    } else {
        $('.contest-background').css({ 'transform': 'translate3d(' + translateX +'px, ' + translateY + 'px, 0) scale(' + scale + ')', 'opacity' : opacity });
    }

}