• There is NO official Otland's Discord server and NO official Otland's server list. The Otland's Staff does not manage any Discord server or server list. Moderators or administrator of any Discord server or server lists have NO connection to the Otland's Staff. Do not get scammed!

[Gesior AAC] Equipment Shower

@up i dont know what to do :|
Tooltip.css
Code:
#tt {
 position:absolute;
 display:block;
 background:url(images/tt_left.gif) top left no-repeat;
 }
 #tttop {
 display:block;
 height:5px;
 margin-left:5px;
 background:url(images/tt_top.gif) top right no-repeat;
 overflow:hidden;
 }
 #ttcont {
 display:block;
 padding:2px 12px 3px 7px;
 margin-left:5px;
 background:#222;
 color:#fff;
 }
#ttbot {
display:block;
height:5px;
margin-left:5px;
background:url(images/tt_bottom.gif) top right no-repeat;
overflow:hidden;
}

#bg {background-image:url('images/bg.gif');border:1px solid #000;width:110px;height:155px;padding:1px;}
#bg .col1 {float:left;margin-left:2px;}
#bg .col2 {float:left;margin-left:2px;}
#bg .col3 {float:left;margin-left:2px;}

.a2,.a0-2 {margin-top:15px;}
.a6,.a0-6 {margin-top:5px;}
.a9,.a0-9 {margin-top:5px;margin-bottom:15px;}

.a1,.a4,.a7,.a8,.a0-1,.a0-4,.a0-7,.a0-8 {margin-top:1.5px;}

.a3,.a0-3 {margin-top:15px;}
.a5,.a0-5 {margin-top:5px;}
.a10,.a0-10 {margin-bottom:15px;margin-top:5px;}

.a0,.a1,.a2,.a3,.a4,.a5,.a6,.a7,.a8,.a9,.a10 {width:34px;height:34px;}
.a0-1,.a0-2,.a0-3,.a0-4,.a0-5,.a0-6,.a0-7,.a0-8,.a0-9,.a0-10 {width:34px;height:34px;background-image:url('images/0.gif');}
/*img {position:relative;left:1px;top:1px;}*/
.a2 {background-image:url('images/2.gif');}
.a6 {background-image:url('images/6.gif');}
.a9 {background-image:url('images/9.gif');}

.a1 {background-image:url('images/1.gif');}
.a4 {background-image:url('images/4.gif');}
.a7 {background-image:url('images/7.gif');}
.a8 {background-image:url('images/8.gif');}

.a3 {background-image:url('images/3.gif');}
.a5 {background-image:url('images/5.gif');}
.a10 {background-image:url('images/10.gif');}

.soul {background-image:url('images/soul.png');margin-top:-14px;z-index:99999;height:25px;margin-left:-2px;;}
.cap {background-image:url('images/cap.png');margin-top:-14px;z-index:99999;height:25px;margin-left:-2px;;}
.cap .txtc {color: #CCCCCC;font-size:8px;font-weight:bold;  
  padding-left: 5px;
  padding-top: 3px;
  padding-right: 5px;
  padding-bottom: 2px;}
 .soul .txts {color: #CCCCCC;font-size:8px;font-weight:bold;  
  padding-left: 5px;
  padding-top: 3px;
  padding-right: 5px;
  padding-bottom: 2px;}

.norm {color:#c2c2c2;font-weight:bold;font-size:12pt;text-decoration:underline;padding-bottom:6px;}
.rare {color:#002cba;font-weight:bold;font-size:12pt;text-decoration:underline;padding-bottom:6px;}
.epic {color:#6c008b;font-weight:bold;font-size:12pt;text-decoration:underline;padding-bottom:6px;}
.lege {color:#ffc000;font-weight:bold;font-size:12pt;text-decoration:underline;padding-bottom:6px;}

.attr {font-size:9pt;}

tooltip.js
Code:
var tooltip=function(){
 var id = 'tt';
 var top = 3;
 var left = 3;
 var maxw = 300;
 var speed = 10;
 var timer = 20;
 var endalpha = 90;
 var alpha = 0;
 var tt,t,c,b,h;
 var ie = document.all ? true : false;
 return{
  show:function(v,w){
   if(tt == null){
    tt = document.createElement('div');
    tt.setAttribute('id',id);
    t = document.createElement('div');
    t.setAttribute('id',id + 'top');
    c = document.createElement('div');
    c.setAttribute('id',id + 'cont');
    b = document.createElement('div');
    b.setAttribute('id',id + 'bot');
    tt.appendChild(t);
    tt.appendChild(c);
    tt.appendChild(b);
    document.body.appendChild(tt);
    tt.style.opacity = 0;
    tt.style.filter = 'alpha(opacity=0)';
    document.onmousemove = this.pos;
   }
   tt.style.display = 'block';
   c.innerHTML = v;
   tt.style.width = w ? w + 'px' : 'auto';
   if(!w && ie){
    t.style.display = 'none';
    b.style.display = 'none';
    tt.style.width = tt.offsetWidth;
    t.style.display = 'block';
    b.style.display = 'block';
   }
  if(tt.offsetWidth > maxw){tt.style.width = maxw + 'px'}
  h = parseInt(tt.offsetHeight) + top;
  clearInterval(tt.timer);
  tt.timer = setInterval(function(){tooltip.fade(1)},timer);
  },
  pos:function(e){
   var u = ie ? event.clientY + document.documentElement.scrollTop : e.pageY;
   var l = ie ? event.clientX + document.documentElement.scrollLeft : e.pageX;
   tt.style.top = (u - h) + 'px';
   tt.style.left = (l + left) + 'px';
  },
  fade:function(d){
   var a = alpha;
   if((a != endalpha && d == 1) || (a != 0 && d == -1)){
    var i = speed;
   if(endalpha - a < speed && d == 1){
    i = endalpha - a;
   }else if(alpha < speed && d == -1){
     i = a;
   }
   alpha = a + (i * d);
   tt.style.opacity = alpha * .01;
   tt.style.filter = 'alpha(opacity=' + alpha + ')';
  }else{
    clearInterval(tt.timer);
     if(d == -1){tt.style.display = 'none'}
  }
 },
 hide:function(){
  clearInterval(tt.timer);
   tt.timer = setInterval(function(){tooltip.fade(-1)},timer);
  }
 };
}();
 

Similar threads

Back
Top