// JavaScript Document
$(function(){
										//this is intended to wait for all the images to load before running the slideshow
										
										init_slideshow();
										skinNav();
									})
				
									init_slideshow = function()
									{
										$('#work_dtl_slides').cycle({
											fx:'fade',
											timeout:0,
											speed:500,
											pager:'#slide_navigation',
											next:'#work_dtl_nextBTN_half',//<a href="#" id="next_btn1">next</a>
											prev:'#work_dtl_prevBTN_half',//<a href="#" id="prev_btn1">prev</a>											
											after:update_slide_caption,
											before:fade_slide_caption
										})
									}
		
									fade_slide_caption = function(next, previous)
									{
										caption_container = $('#project_caption')
										caption_container.fadeOut('1')
										//$("#work_dtl_slideshow").prepend("<h1>"+$(this).attr('class')+$(this).height()+"</h1>");
										$("#work_dtl_slideshow").animate({height:eval(($(this).height()))},500);
									}
		
									update_slide_caption = function(next, previous)
									{
										updateCurrentSlide();
										caption_container = $('#project_caption')
										
										caption = $('span.slide_caption', previous)
										caption_container.fadeIn('1')
										caption_container.html(caption.html())
										
										
			
									}
									update_div_height = function(next, previous)
									{
										
										
									}
									function skinNav(){
														var myCounter = 0;
										$("#slide_navigation a").each(function()
																				 {
//																				 	$(this).addClass('myCounter');
																					myCounter++;
																					$(this).addClass("navItem"+myCounter);
//																					alert(myCounter);
																				 })
									}