$(document).ready(function(){
   $('body').append('<div id="blackbox" style="margin:0; padding:0; display:none; height:100%; width:100%; background: #000; position:fixed; top:0px; left:0px; z-index:1000;"></div>');
   $('#blackbox').click(function(){
      $('#blackbox').fadeOut('fast');
   });
   $('#main img').each(function(i){
      $(this).css('cursor', 'pointer');
      
      $(this).click(function() {
         var src = $(this).attr('src');
         src = src.substring(0,(src.length-10)) + '.jpg';
         var imgtxt = $(this).attr('alt');
         $('#blackbox').html('<img style="display:block; margin:100px auto;" src="' + src + '" /><p style="text-align:center; color:#fff;">' + imgtxt + '</p>');
         $('#blackbox').fadeIn('fast');
      });
   });
});