function showContent(newContent) { 
//Fade out the old content quickly, then fade in the new content slowly.
  $("#response").fadeTo(600,0.0,function() { 
    $("#response").load(newContent+".html", function() { 
                     $("#response").fadeTo(1000,1.0) 
                  }); 
  });  
} 

$(document).ready(function(){

	// load index page when the page loads
	$("#response").load("homepage.html");

	$("#home").click(function(){
		showContent("homepage");
	});

	$("#salon").click(function(){
		showContent("salon");
	});

	$("#hair").click(function(){
		showContent("hair");
	});

	$("#beauty").click(function(){
		showContent("beauty");
	});

	$("#stylists").click(function(){
		showContent("stylists");
	});

	$("#hairprices").click(function(){
		showContent("hairprices");
	});

	$("#beautyprices").click(function(){
		showContent("beautyprices");
	});

	$("#contact").click(function(){
		showContent("contact");
	});

	//Handle music events
	$('#play').click(function(){
		music.play();
	});

	$('#pause').click(function(){
		music.pause();
	});

});