Adicione este javascript em "Index" e "Sub-Forums"
- Código:
$(document).ready(function(){
$('.tcr a[href*="/u"]').mouseover(function(){
$(this).parents('strong').css('position', 'relative');
$('.perfilInfo').remove();
$(this).parents('.tcr').css('overflow', 'visible');
$(this).before('
<div class="perfilInfo" style="position:absolute;">
<span class="setPerfil">
<span>
<img class="PerfilInfoImg" src="http://forum.teamspeak.com.br/public/style_images/master/profile/default_large.png" />
<h2>'+$(this).html()+'</h2>
<div class="setInfos">
<p><b>Agradecimentos:</b> <span></span></p>
<p><b>Cadastrado:</b> <span></span></p>
<p><b>Posts:</b> <span></span></p>
<p><b>Humor:</b> <span></span></p>
</div>
<div class="linkPrfwidth">
<span class="reputation">
<span></span>
</span>
<span class="linkPrf">
<a href="/privmsg?mode=post&u='+$(this).attr('href').replace('/u', '')+'">Enviar MP</a></span>
<span class="linkPrf"><a href="'+$(this).attr('href')+'">Ver perfil</a></span>
</span>
</div>
</span>
</span>
</div>
');
$.get($(this).attr('href'), function(retornoMembro){
var avtPrf = $('#profile-advanced-right img:first', retornoMembro).attr('src');
$('.PerfilInfoImg').attr('src', avtPrf);
var perfil_rep = $('#field_id-14 dd', retornoMembro).html();
var perfil_post = $('#field_id-6 dd', retornoMembro).html();
var perfil_cad = $('#field_id-4 dd', retornoMembro).html();
var perfil_lastV = $('#field_id-13 dd', retornoMembro).html();
var perfil_mood = $('#field_id8 dd', retornoMembro).html();
$('.reputation:eq(0) span').html(perfil_rep);
$('.setPerfil p:eq(0) span').html(perfil_post);
$('.setPerfil p:eq(1) span').html(perfil_cad);
$('.setPerfil p:eq(2) span').html(perfil_lastV);
$('.setPerfil p:eq(3) span').html(perfil_mood);
});
//get
$('.perfilInfo').mouseleave(function(){
$(this).remove();
});//mouseleave
});
//mouseover
});
Agora adicione este css:
- Código:
/*--Perfil Hover--*/
.perfilInfo {
background: url(http://forum.teamspeak.com.br/public/style_images/master/stems/bottomleft.png) no-repeat 98% 0%;
float: left;
height: 14em;
left: -43em;
padding: 16px 0px 38px 5px;
top: 13px;
width: 510px;
height: 178px;
z-index: 999;
}
.linkPrf {
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
background: #ECECEC url('http://i74.servimg.com/u/f74/18/08/53/97/highli11.png') repeat-x 0 0;
border: 1px solid #DBDBDB;
border-radius: 2px;
bottom: -7px;
box-shadow: 0 1px 0 rgba(255, 255, 255, 1) inset, 0 1px 0 rgba(0, 0, 0, 0.3);
color: #616161;
text-shadow: white 0px 1px 0px;
float: left;
height: 14px;
margin: 2px;
padding: 2px;
text-align: center;
text-decoration: none!important;
left: 1em;
transition: all .2s ease-in-out;
width: 8em;
}
.linkPrf:hover{color: #4C4C4C;
background-color: #F8F8F8;}
.linkPrf:hover a{color: #4C4C4C;}
.linkPrf a{color:#616161 !important; font:normal 12px; text-decoration:none;}
.setPerfil {
background: rgba(0, 0, 0, 0.3);
display: block;
height: 100%;
padding: 5px;
padding-bottom: 10px;
border-radius: 2px;
}
.setPerfil > span {
background: #f9f9f9;
border-radius: 3px;
display: block;
height: 100%;
padding: 3px;
border: 1px solid #999;
}
.setPerfil .PerfilInfoImg {
width: 91px;
height: 91px;
float: left;
display: table;
padding: 1px;
border: 1px solid #D5D5D5;
background: white;
-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
}
.setPerfil .PerfilInfoImg:hover {
border-color: #A1A1A1;
-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.2);
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
}
.setPerfil p div{
display: inline;
}
.setPerfil h2 {
float: left;
font: bold 19px "Trebuchet MS";
display: block;
background: #E1E1E1;
width: 382px;
padding: 5px;
text-shadow: 1px 1px 0 white;
border-radius: 0 10px 0px 0;
box-shadow: 1px 1px 0 #CCC;
margin-bottom:10px;
}
.setPerfil p {
margin: 2px 5px;
display: block;
background: #F1F1F1;
width: 350px;
text-align: left;
padding: 5px;
box-shadow: 1px 1px 0 #CCC;
font-weight: normal;
border-left: 3px solid #333;
border-top: 1px solid #333;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
-webkit-transition: all .2s ease-in-out;
}
.setPerfil p:hover {
box-shadow: 1px 1px 0 #9A9A9A;
}
.linkPrfwidth {
width: 120px;
}
.reputation {
color: white;
background: #8DB13E url('http://i74.servimg.com/u/f74/18/08/53/97/highli10.png') repeat-x 0 1px;
float: center;
bottom: -7px;
text-align: center;
left: 1em;
margin: 2px;
margin-top: 5px;
font-weight: bold;
padding: 3px 8px;
display: inline-block;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
width: 7em;
border-radius: 3px;
text-shadow: rgba(0, 0, 0, 0.3) 0px -1px 0px;
}
.setInfos {
float: right;
}
(2º Código)
Adicione este javascript em "Index" e "SubForums"
- Código:
jQuery(document).ready(function(){if(!window.localStorage)return;var default_avatar='http://2img.net/i/fa/invision/pp-blank-thumb.png';var caching_time=24*60*60*1000;var caching_error=60*1000;var set_avatar=function(id){$('.mini_ava.member'+id).html('<img src="'+get_avatar(id)+'" />')};var get_avatar=function(id){if(localStorage.getItem('t_ava'+id)<+new Date-caching_time||(localStorage.getItem('d_ava'+id)==default_avatar&&localStorage.getItem('t_ava'+id)<+new Date-caching_error)){localStorage.setItem('d_ava'+id,default_avatar);$.get('/u'+id,function(d){localStorage.setItem('t_ava'+id,+new Date);localStorage.setItem('d_ava'+id,$('#profile-advanced-right .module:first div img:first,.forumline td.row1.gensmall:first > img, .frm-set.profile-view.left dd img,dl.left-box.details:first dd img, .row1 b .gen:first img, .real_avatar img',d).first().attr('src')||default_avatar);set_avatar(id)})}return localStorage.getItem('d_ava'+id)};var to_replace={};$('dd.lastpost strong a.gensmall, .ipbtable tr td:last-child span strong a.gensmall, .table td.tcr strong a.gensmall, .forumline .row3.over strong a.gensmall').each(function(){to_replace[$(this).attr('href').substr(2)]=1;$(this).closest('td,dd').prepend('<div class="mini_ava member'+$(this).attr('href').substr(2)+'"></div>')});for(i in to_replace){set_avatar(i)}});
Agora adicione este Css:
- Código:
.mini_ava img {
width: 36px;
height: 36px;
margin: 0 5px;
padding: 1px;
border: 1px solid #D5D5D5;
background: white;
-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
-moz-box-shadow: 0px 2px 2px rgba(0,0,0,0.1);
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.1);
float: left;
}
Avatar na ultimas postagem e Caixa do Perfil Seg 20 maio 2013 - 19:37
![[Dark]Doki-.](https://2img.net/u/1717/45/34/10/avatars/20-0.jpg)
