block by nitaku 8054295

Before/after image

Full Screen

A widget that can be used to compare two images by dragging.

Photos are taken from Google Earth, I do not own them. The grayscale one is from 2003, while the other is from 2013. By dragging the photos, you can see the bridge that has been destroyed in 2009 at the bottom of the picture.

Inspired in part by this ABC page on the Fukushima disaster.

The technique used leverages SVG image patterns. A hack (an overlayed gray rectangle) is used to hide the ugly progressive rendering of image loading.

index.js

index.html

index.coffee

index.css

index.sass