jasonheecs · August 29, 2015 14:10
diff --git a/index.html b/index.html
 <img src="http://cloudcannon.com/img/blog/deconstructions/crisp-golden-gate.jpg" />
 
diff --git a/LEEeXJ.markdown b/LEEeXJ.markdown
diff --git a/script.js b/script.js
 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);
diff --git a/style.css b/style.css
 img {
 	margin: 1000px 0;
 }
	<img src="http://cloudcannon.com/img/blog/deconstructions/crisp-golden-gate.jpg" />
	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);