function showtooltip(type,img,name,desc) {
  $('.skin-tooltip').html('<div class="tipBody"><div class="usage-kit">Usage Key</div><div class="usage-img"><img src="'+ img +'"/><div class="usage-type">Skin'+type + ':</div><div class="usage-description">' + name + '</div><div class="usage-type">Description:</div><div class="usage-description">'+ desc +'</div></div>');
  $('.skin-tooltip').css({display: "block"});
  $('.skin-tooltip').removeClass("withoutheadline");
}
function showdescription(desc) {
  $('.skin-tooltip').html('<div class="tipBody"><div class="usage-kit">Description:</div><div class="usage-type">&nbsp;</div><div class="usage-description">'+ desc +'</div></div>');
  $('.skin-tooltip').css({display: "block"});
  $('.skin-tooltip').removeClass("withoutheadline");
}

function showinfo(info){
  $('.skin-tooltip').html('<div class="tipBody"><div class="usage-kit"></div><div class="usage-type">&nbsp;</div><div class="usage-description">'+ info +'</div></div>');
  $('.skin-tooltip').css({display: "block"});
  $('.skin-tooltip').addClass("withoutheadline");
}

function hidetooltip() {
  $('.skin-tooltip').css({display: "none"});
}

function movetooltip(e) {
	var tempX = e.clientX;
	var tempY = e.clientY;

   if ( e.pageX == null && e.clientX != null ) {
      b = document.body;
      var e = document.documentElement;
	  tempX+= ((e && e.scrollLeft || b.scrollLeft || 0)-87);
	  tempY+= ((e && e.scrollTop || b.scrollTop || 0)-210);

   }else{
	   tempX =(e.pageX-87);
	   tempY = (e.pageY-210);
   }
   $("#skin-tooltip").css({top: tempY, left: tempX});
}