JS animate page change

page_change.js

// Animate page change.
$(function() {
  $.fn.slideTo = function(data) {
		var width = parseInt( $('.main').css('width') );

		var transfer = $('<div class="transfer"></div>').css({ 'width': (2 * width) + 'px', "overflow": "hidden"});
		var current = $('<div class="current"></div>').css({ 'width': width + 'px', 'left': '0', 'float': 'left' }).html( $('.main').html() );
		var next = $('<div class="next"></div>').css({ 'width': width + 'px', 'left': width + 'px', 'float': 'left' }).html(data);

		transfer.append(current).append(next);

		$('.main').html('').append(transfer);

		// console.log( "next height: "+next.height() );
		// console.log( "current height: "+current.height() );
		var newheight = next.height();

		transfer.animate({ 'margin-left': '-' + width + 'px' }, 300, function () {
			$('.main').html(data);
		});
	};

	$(document).on('click', '.main .content a', function(event) {

		history.pushState( null, null, $(this).attr('href') );

		$.get( $(this).attr('href'), function(data) {
			$(data).each( function() {

				if( $(this).is('.main') ) {
					$('.main').slideTo( $(this).html() );
				}
			});
		});

		return false;
	});

	$(window).bind('popstate', function (e) {
		if (e.originalEvent.state && e.originalEvent.state.path) {
			$.get(e.originalEvent.state.path, function(data) {
				$('#slider').slideTo(data);
			});

			return false;
		}

		return true;
	});
});