$(document).ready(function(){

  var width = $('.skater_photo').find('img').width();
  var margin = (528 / 2 - width / 2) - 10;
  
  $('.skate_photo_report').find('img').css("marginLeft", margin + "px");

  $('#pane12').jHScrollHorizontalPane({
    scrollbarHeight:17,
    scrollbarMargin:10
  });
  var x= 0;
  $('.showImage').click(function(){
    x++;
    var image = $(this).attr('rel');
    var title = $(this).find('img').attr('alt');
    $('#skate_photo_info').html(title);

    var this2 = this
    $(".comic").append("<img src='/uploads/comics/" + image + "' class='imgfader' id='comic" + (x) + "' style='position:absolute;' />");
    $(".comic img:not(#comic"+x+")").fadeOut('slow', function(event){
                                                            $(this).remove();
                                                            $('.showImage img').fadeTo('fast',0.5);
                                                          });
    $(".skate").append("<a class='skater_photo' id='a-skate" + (x) + "' href='/uploads/skate/large/" + image + "'><img src='/uploads/skate/" + image + "' class='imgfader' id='skate" + (x) + "' style='position:absolute;' /></a>");

    $(".skate img:not(#skate"+x+")").fadeOut('slow', function(event){
                                                            $(this).remove();
                                                            $('.showImage img').fadeTo('fast',0.5);
                                                          });
    $("a.skater_photo").fancybox({
        'zoomSpeedIn'      : 500,
        'zoomSpeedOut'      : 300
      });
    $(".skate a:not(#a-skate"+x+")").remove();

    var width = $('.skater_photo').find('img').width();
    var margin = (528 / 2 - width / 2) - 10;
    
    $('.skater_photo').find('img').css("marginLeft", margin + "px");
    
  });

$('.showImage img').hover(
    function(){
      $(this).fadeTo('fast',1);
    },
    function(){
      if ($('.comic img').attr('src') != '/uploads/comics/' + $(this).parent().attr('rel'))
      {
        $(this).fadeTo('fast',0.5);
      }
    });
});