blurImages = function () {
  $('img').each(function () {
    var offset = $(this).offset();
    offset.top += $(this).outerHeight() / 2; 
    var centerOfTheScreen = window.scrollY + $(window).height() / 2;
    var distanceFromCenter = Math.abs(centerOfTheScreen - offset.top);
    var blurFraction = (Math.min(distanceFromCenter, 300) / 300);
    $(this).css('-webkit-filter', 'blur(' +(10 * blurFraction)+ 'px)')
  });  
};

$(window).on('scroll', blurImages);
$(document).ready(blurImages);