$(document).ready(function(){

  $('.on').addClass("display-none");

//Fade in images on home page one by one

$(window).load(function () {

$('#home .img').each(function(i) {
  $(this).delay(i*100).queue(function(n) { 
  n(); })
  .fadeIn('medium')
});

$('.on').removeClass("display-none");

$('#page .img').fadeIn("slow");


		//START HOME PAGE IMAGE FADE EFFECTS
		
			$("#home .img").hover(
	
			//Roll on

			function() {

				//Get second class of image wrapper div eg. "size-1"
				var myclass = $(this).attr("class").split(" ")[1];
				$('.' +myclass + ' .off').fadeOut("fast");	
				
				var hairstyle = $(this).find('img').attr('alt');	
				var date = $(this).find('img').attr('title');			
			
				//Hiding img-meta
				/*
				$(".img-meta").removeClass("size-1 size-2 size-3 size-4 size-5 size-6 size-7 size-8 size-9 size-10", function() {
 			 		$('.img-meta').fadeOut("fast");
 			 	});
				*/
			
				//Displaying img-meta
				/*
				$('.img-meta').addClass(myclass);
				$('.img-meta').fadeIn("fast");
				$(".img-meta").html('<p>Style: <span>' +hairstyle +'</span></p><p>Date: <span>'+date +'</span></p>');
				*/
			},
	
			//Roll off

			function() {
				//Get second class of image wrapper div eg. "size-1"
				var myclass = $(this).attr("class").split(" ")[1];
				$('.' +myclass + ' .off').fadeIn("fast");
			});
	
		
		//END HOME PAGE IMAGE FADE EFFECTS
});	
		
	
	if($.browser.msie)
	{
				$(function () { // run this code on page load (AKA DOM load)
 
		/* set variables locally for increased performance */
		var scroll_timer;
		var displayed = false;
		var $nav = $('#scroll-nav');
		var $window = $(window);
		var top = $('.main-navigation').position().top +210;
 
		/* react to scroll event on window */
		$window.scroll(function () {
			window.clearTimeout(scroll_timer);
			scroll_timer = window.setTimeout(function () { // use a timer for performance
				if($window.scrollTop() <= top) // hide if at the top of the page
				{
					displayed = false;
					$nav.hide();
				}
				else if(displayed == false) // show if scrolling down
				{
					displayed = true;
					$nav.stop(true, true).show().click(function () { $message.hide(); });
				}
			}, 100);
		});
	});
	
	}		
		
		
		
		//START SLIDE DOWN NAV	
		$(function () { // run this code on page load (AKA DOM load)
 
		/* set variables locally for increased performance */
		var scroll_timer;
		var displayed = false;
		var $nav = $('#scroll-nav');
		var $window = $(window);
		var top = $('.main-navigation').position().top +210;
 
		/* react to scroll event on window */
		$window.scroll(function () {
			window.clearTimeout(scroll_timer);
			scroll_timer = window.setTimeout(function () { // use a timer for performance
				if($window.scrollTop() <= top) // hide if at the top of the page
				{
					displayed = false;
					$nav.animate({"top": "-90px"}, "slow");
				}
				else if(displayed == false) // show if scrolling down
				{
					displayed = true;
					$nav.stop(true, true).animate({"top": "+=90px"}, "slow").click(function () { $message.animate({"top": "-90px"}, "slow"); });
				}
			}, 100);
		});
	});

		//END SLIDE DOWN NAV
		
		
		
		//START SUBNAV EFFECT
			$('.main-navigation ul li ').hover(function(){
				$(this).find('.children').fadeIn('fast').animate({left:'0px'},{queue:false,duration:500});
			}, function(){
				$(this).find('.children').fadeOut('fast').animate({left:'-200px'},{queue:false,duration:500});
	});
	
	//Add last class to last but one list item in sub nav (last li is transparent png)
	var $ul = $('.children > li');
	$ul.eq($ul.length-2).addClass('last');

	
});