jQuery( document ).ready(
function( ){
	var effect_time = 300;
	
	var blackout = jQuery( '<div id="blackout"> </div>' ).appendTo( '#container' );
	
	jQuery( '#content > ol > li .screen-shots' )
		.addClass( 'screen-shots-with-js' )
		.each(
			function( ){
				var t = jQuery( this );
				var trigger = jQuery( '<span class="screen-shots-trigger">Show More</span>' ).
					click( function( event ){ 
						t.parent( ).css( 'z-index', 5 ); // For IE
						t.css(
								{ display: 'block',
								  opacity: 0,
								  marginTop: '400px'
								}
							)
						 .animate(
						 	{ marginTop: 0,
						 	  opacity: 1
						 	 }
						 , effect_time ); 
						 
						 var first_time = true;
						 var hide_screen_shots = function( ){
						 	if( first_time ){
						 		first_time = false;
						 		return true;
						 	}
							t.animate(
								{ marginTop: '-400px',
								  opacity: 0
								}
							  , effect_time 
							  , function( ){ t.hide( ); t.parent( ).css( 'z-index', 0 ); } );
							jQuery( 'body' ).unbind( 'click', hide_screen_shots );
						 };
						 
						 jQuery( 'body' ).click( hide_screen_shots );
						 
						 //event.stopPropagation( )
						 //return false;
					} );
				
				t.hide( )
				 .before( trigger )
				 .prepend( '<span class="screen-shots-close">Close</span>' );
			}
		);


} );