$(document).ready(function() {
 
  var newHash     = '';
  $mainContent = $('section');

  $('nav').delegate('a', 'click', function() {
    window.location.hash = $(this).attr('data-link');
    return false;
  });

 $(window).bind('hashchange', function() {
    if(window.location.hash == '') {
      window.location.hash = $('nav a:first').attr('data-link');
    } else {
      newHash = window.location.hash.substr(1);
    }
    $mainContent.fadeOut(400).load(newHash + " section > *", function() {
       $mainContent.fadeIn(600);
    });
    $('nav a').removeClass('active');
    $('nav a[data-link="'+newHash+'"]').addClass('active');
 });

 $(window).trigger('hashchange');

});