jQuery(function() {
  jQuery(".product").each(function() {
    jQuery(this).children("div").mouseover(function() {
      var path = jQuery(this).attr("Tpreview");

      if(path) {

        var top = jQuery(this).offset().top;
        var left = jQuery(this).offset().left;

        var img = jQuery("<img src='"+path+"' alt='' />");
        var imgObj = new Image();
        imgObj.src = path;
        
        var position = jQuery(this).attr("Tmove");

        var move = position=="left" ? 155 : -imgObj.width - 15;

        jQuery("#image-preview")
          .css('top', top-144)
          .css('left', left+move)
          .html(img)
          .removeClass("invisible")
          .css('opacity', "0")
          .addClass("visible")
          .animate({opacity: 1}, 500 );
      }

    }).mouseout(function() {
      jQuery("#image-preview")
          .html("")
          .removeClass("visible")
          .addClass("invisible");
    });
  });
});

jQuery(function() {

  jQuery(".type").find("a").hover(
  
    function() {
      jQuery(this).find("img").addClass("type-zoom");
    },
    
    function() {
      jQuery(this).find("img").removeClass("type-zoom");
    }

  );

  jQuery(".product_group").find("a").hover(

    function() {
      jQuery(this).find("img").addClass("product-group-zoom");
    },

    function() {
      jQuery(this).find("img").removeClass("product-group-zoom");
    }

  );

  jQuery(".brand").find("a").hover(

    function() {
      jQuery(this).find("img").addClass("brand-zoom");
    },

    function() {
      jQuery(this).find("img").removeClass("brand-zoom");
    }

  );

});


/*jQuery(function() {
  var spotlight = {
    // the opacity of the "transparent" images - change it if you like
	opacity : 0.4,
  };

  //when mouse over the list item...
  jQuery('#transparent-container').find("li").hover(function(){
    
    //...find the image inside of it and add active class to it and change opacity to 1 (no transparency)
    jQuery(this).find("img").addClass('active').css({ 'opacity' : 1});

	//get the other list items and change the opacity of the images inside it to the one we have set in the spotlight array
    $(this).siblings().find('img').css({'opacity' : spotlight.opacity}) ;


	//when mouse leave...
  }, function(){

    //... find the image inside of the list item we just left and remove the active class
	jQuery(this).removeClass('active');
    jQuery(this).siblings().find('img').css({'opacity' : 1});

  });

});*/