Avatar ao lado de ultima mensagem

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Avatar ao lado de ultima mensagem

Mensagem por pyrohinotama em Dom 28 Abr 2013 - 18:37

Qual é minha questão:


gstaria de que ao lado das ultimas mensagem aparecesse o avatar que nem na imagem acima, lembrando que meu forum é phpBB2

Endereço do meu fórum:
http://rpgadventure.umforum.net

Versão do fórum:
PHPBB2


Última edição por pyrohinotama em Dom 28 Abr 2013 - 19:16, editado 1 vez(es)
avatar

pyrohinotama
Usuário destaque

Masculino
Inscrito dia : 29/03/2013
Mensagens : 852
Pontos Ativos : 1304

Ver perfil do usuário http://rpgadventure.umforum.net/h2-alianca-katsuo

Resolvido Re: Avatar ao lado de ultima mensagem

Mensagem por Quakeeline em Dom 28 Abr 2013 - 18:54

Olá,

Crie um Novo JS com este código

Código:
$(document).on('ready', function() {
$('table.forumline[width="100%"][border="0"] tbody tr td.row3.over').prepend('<div class="avat-miembro"><div>');
$('table.forumline[width="100%"][border="0"] tbody tr td.row3.over .avat-miembro').each(function () {
var profileUserURL = $(this).parent().find('span strong a').attr('href');
$(this).html('<a href="' + profileUserURL + '" class="avat-miembro-enlace"><img src="Endereço-da-imagem" alt="No Avatar" /></a>');
$(this).children('a').load(profileUserURL + ' table[width="100%"][border="0"] td[width="300"][valign="top"] table.forumline[width="100%"][border="0"] td.row1.gensmall[align="center"] img:eq(0)')
});
});

Investimento: Em todas as páginas

Depois adiciona este código em sua Folha de estilo CSS

Código:
        .avat-miembro {
        float: left;
        }
        .avat-miembro img {
        width: 40px;
        height: 40px;
        padding: 1px;
        margin: 0 5px;
        border-radius: 10px
        }

Até
avatar

Quakeeline
Nível 9

Masculino
Inscrito dia : 26/04/2013
Mensagens : 190
Pontos Ativos : 290

Ver perfil do usuário http://lfdesign.forumeiros.com

Resolvido Re: Avatar ao lado de ultima mensagem

Mensagem por pyrohinotama em Dom 28 Abr 2013 - 19:05

o codigo funcionou, mas tem como colocar aquela borda ao redor, e tambem organizar melhor as informações,acho que a imagem devia ser um pouco maior e em formato de retangulo e não de quadrado.

avatar

pyrohinotama
Usuário destaque

Masculino
Inscrito dia : 29/03/2013
Mensagens : 852
Pontos Ativos : 1304

Ver perfil do usuário http://rpgadventure.umforum.net/h2-alianca-katsuo

Resolvido Re: Avatar ao lado de ultima mensagem

Mensagem por Quakeeline em Dom 28 Abr 2013 - 19:07

Olá,

Me informe o fórum aonde viu daquele modelo

Até
avatar

Quakeeline
Nível 9

Masculino
Inscrito dia : 26/04/2013
Mensagens : 190
Pontos Ativos : 290

Ver perfil do usuário http://lfdesign.forumeiros.com

Resolvido Re: Avatar ao lado de ultima mensagem

Mensagem por pyrohinotama em Dom 28 Abr 2013 - 19:10

http://hexusgames.forumeiros.com/forum

quanto ao tamanho da imagem: eu ja resolvi, coloquei 40 de largura e 73 de altura.
avatar

pyrohinotama
Usuário destaque

Masculino
Inscrito dia : 29/03/2013
Mensagens : 852
Pontos Ativos : 1304

Ver perfil do usuário http://rpgadventure.umforum.net/h2-alianca-katsuo

Resolvido Re: Avatar ao lado de ultima mensagem

Mensagem por Quakeeline em Dom 28 Abr 2013 - 19:13

Olá,

Substitua o código da Folha de estilo CSS por este

Código:
        .avat-miembro {
        float: left;
        }
.avat-miembro img {
    border: 1px solid rgb(207, 207, 207);
    float: left;
    height: 73px;
    margin: 0px 5px;
    padding: 1px;
    width: 40px;
}

Até
avatar

Quakeeline
Nível 9

Masculino
Inscrito dia : 26/04/2013
Mensagens : 190
Pontos Ativos : 290

Ver perfil do usuário http://lfdesign.forumeiros.com

Resolvido Re: Avatar ao lado de ultima mensagem

Mensagem por pyrohinotama em Dom 28 Abr 2013 - 19:16

ae ficou bom, valeu Quakeline Feliz
avatar

pyrohinotama
Usuário destaque

Masculino
Inscrito dia : 29/03/2013
Mensagens : 852
Pontos Ativos : 1304

Ver perfil do usuário http://rpgadventure.umforum.net/h2-alianca-katsuo

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum