$(document).ready(function() {
 
function onBefore() { 

    contents = this.childNodes;

//    alert("Contents has length of " +contents.length);
  
    for (i=1 ; i < contents.length ; i++) {  

//	contents[i]
//
//        contents[i].
//      contents[2].show();
    }
} 

// Need to have, a div with ID='porfolio', with a series of div, span, or img tags in it to be the slideshow images


// Start the cycle, and idnetify the start and next buttons

$('#portfolio').cycle({timeout:4000,
                       next:   '#portfolio_controls_next',
                       prev:   '#portfolio_controls_prev',             
                       cleartype:  1,  // enable cleartype corrections 
                       before: onBefore
});


// Add hover options to fade the controls in and out when mousing over, and stop and start the animation
// Any elements with the porfolio_controlls class will be faded in and out as well.

$('#slideshow').hover(
        function() {  $('.portfolio_controls').stop(true,true).fadeIn();        $('#portfolio').cycle('pause');   } ,
        function() {  $('.portfolio_controls').stop(true,true).fadeOut();      $('#portfolio').cycle('resume');  }
    );



// $('#portfolio').fadeIn();
$('.portfolio_text').show();
$('.portfolio_image').show();

});


//
// To fix PNGs in internet Explorer: http://stackoverflow.com/questions/1156985/jquery-cycle-ie7-transparent-png-problem
//

// Instead just made them .gif files