jQuery(function($) {
 //$('div#content').supersleight();

 $('.info_rollover_right').mouseenter(function(event) {
   $('.product_rollover').hide();
   var id;
   if($(event.target).is('.product')) {
    //console.log($(event.target).parent().attr('id'));
    id = $(event.target).attr('id');
   } else if($(event.target).parent().is('.product')) {
    id = $(event.target).parent().attr('id');
   }
   

    id = '#rollover_' + id; 
    //console.log(id);
    $(id + ' .product_info').css('float', 'right');
    $(id)
    .css('border-right', 'none')
    .css('border-left', '6px solid #CCC')
    .css('border-top', '6px solid #CCC')
    .css('border-bottom', '6px solid #CCC');
    
    $(id + '.product_rollover > a').css('position', 'absolute')
    .css('top', '0')
    .css('left', '0')
    .css('display', 'block')
    .css('height', '176px')
    .css('width', '176px');


    var pos = $(this).offset();
    var left = (pos.left -5) + "px";
    var top = (pos.top -5) + "px";
    $(id)
    .css({ top: top, left: left})
    //.stop().hide().fadeIn(200);
    .hide().show();
    //console.log('in ' + event.target + ' ' + $(event.target).is('.product_wrapper'));
 });

$('.info_rollover_left').mouseover(function(event) {
   $('.product_rollover').hide();
   var id;
   if($(event.target).is('.product')) {
    //console.log($(event.target).parent().attr('id'));
    id = $(event.target).attr('id');
   } else if($(event.target).parent().is('.product')) {
    id = $(event.target).parent().attr('id');
   }  

   id = '#rollover_' + id;
    $(id + '.product_info').css('float', 'left');
    $(id + '.product_rollover')
    .css('border-left', 'none')
    .css('border-right', '6px solid #CCC')
    .css('border-top', '6px solid #CCC')
    .css('border-bottom', '6px solid #CCC');

    $(id + '.product_rollover > a').css('position', 'absolute')
    .css('top', '0')
    .css('right', '0')
    .css('display', 'block')
    .css('height', '176px')
    .css('width', '176px');


    var pos = $(this).offset();
    //var left = (pos.left - $('.product_info').width()) + "px";
    var left = (pos.left - 139 -5) + "px";
    var top = (pos.top -5) + "px";
    $(id)
    .css({ top: top, left: left})
    .hide().show();
     //console.log($('.product_info').width());
 });

   $('.product_rollover').mouseleave(function() { $(this).hide() });
  
  
});

