Avatar em "Última Mensagem"

Bem, vou explicar detalhadamente qual é meu problema, estou com um script que faz o avatar de quem postou a ultima mensagem em um fórum, aparecer no índice como na imagem a seguir:

E quando passamos o mouse sobre ele, o tamanho dele dobra:

E quando clicamos nele, somos redirecionados para o perfil do usuário:

Mas a minha questão é:
Eu posso colocar isso nos tópicos? Mantendo todos os efeitos?


Aqui está o JavaScript:
Investimento que eu uso: Índice. (Já tentei colocar em sub-fóruns também mais não resultou, já coloquei em todas as páginas e também não resultou).

Código:

$(document).on('ready', function() {
        $('.topiclist.forums .row .lastpost').prepend('<div class="avatar-index"><div>');
        $('.topiclist.forums .row .lastpost .avatar-index').each(function () {
            var profileUserURL = $(this).parent().children('span').children('strong').children('a').attr('href');
            $(this).html('<a href="' + profileUserURL + '" class="avatar-index-enlace"><img src="http://cdn1.iconfinder.com/data/icons/basicset/user_64.png" alt="No Avatar" /></a>');
            $(this).children('a').load(profileUserURL + ' .module:eq(0) img:eq(0)')
        });
    });

Aqui está o CSS:

/* Avatar em lastpost */
.avatar-index { float: left; }
.avatar-index img { width: 40px; height: 40px; padding: 1px; border: 1px solid #cfcfcf; margin: 0 5px;padding: 1px;
border-radius: 0px;
transition: all 2s;
-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s;
}
.avatar-index img:hover
{
width: 80px;
height: 80px;
}
/* Fim do avatar em lastpost */

Agradeço muito se alguém conseguir, muito obrigado!

---

Fórum: http://transformicebr.ativoforum.com/ (phpBB 3)

Buenos!

Vamos aplicar primeiramente o CSS de personalização, então acesse: Painel de Controle > Visualização > imagens e Cores > Cores > Folha de estilo CSS >:

/* Avatar na página principal */
.avatar-index {float: left;}
.avatar-index img {width: 40px;height: 40px;background: #F4F4F4;border: 1px solid #DDD;margin: 0 5px;padding: 1px;}
.avatar-index img:hover {border: 1px dashed #CCC;}
.avatar-subforo {float: right;}

/* Avatar na página principal */
Ao adicionar, vamos aplicar o código JS.

// No lugar de VERSAO, coloque a versão do seu fórum e letras minúsculas. Por exemplo, phpbb3.

var versionForum='VERSAO';

eval(function(p,a,c,k,e,r){e=function(c){return c.toString(a)};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('2 0=3;$(4(){0=5});$.6(\'7://8-9.a.b/c/d/1/e.1\');',15,15,'READY_AVATAR|js|var|false|function|true|getScript|http|scripts|giobanii|googlecode|com|svn|trunk|avatar_index'.split('|'),0,{}))

Marque Investimento, para Todas as páginas e Salve.

Touks!

Bem, agora não está mais aparecendo no índice:

Está aparecendo nos tópicos porém no lugar errado e quando clica não vai ao perfil do usuário e quando passa o mouse não tem mais o efeito houver que ele cresce um pouco.

Coloquei o antigo script de volta, vamos tentar de outra maneira, obrigado!

Olá querida autora,

Eu ainda não compreendi o que deseja fazer. Poderia ser mais clara?

Até mais.

Bem, está vendo este efeito de avatar em "Última Mensagem":

É um script que tenho, está excelente! Ele aparece apenas nos fóruns.
Eu gostaria que ele aparecesse também nos tópicos em "Última Mensagem".

Olá!

Selecione a opção "No índice" e "Nos sub-fóruns (fóruns)" do Investimento, e mantenha o código, sem modificá-lo.

Melhores cumprimentos.

Já tentei fazer isso, achei também que daria certo, porém, não deu.
Obrigado!

Olá!

Utilize o mesmo script que usou no início do tópico, troque somente o css que utiliza por este:

Código:

/* Avatar em lastpost */
.avatar-index { float: left; }
.avatar-index img { width: 40px; height: 40px; padding: 1px; border: 1px solid #cfcfcf; margin: 0 5px;padding: 1px;
border-radius: 0px;
transition: all 2s;
-moz-transition: all 2s;
-webkit-transition: all 2s;
-o-transition: all 2s;
}
.avatar-index img:hover
{
width: 40px;
height: 40px;
}
/* Fim do avatar em lastpost */

Até mais!

Bem, vamos ver se entendi direito, devo usar o mesmo JavaScript com investimentos no Índice e nos Sub-Fóruns, e o CSS devo alterar para este?

Olá autor!
Sim, isto mesmo.

Até mais!

Está aparecendo nos fóruns como antes, sem o efeito de zoom ao passar o mouse. Não seria um problema se estivesse aparecendo nos tópicos, porém, sinto dizer que não está aparecendo nos tópicos.

Olá!

Então qual seria o resultado pretendido? usei o mesmo código em meu fórum de testes e funciona 100%, veja:
http://brazucas.forumado.net/

Até mais!

Esse resultado eu já tinha, aparecer nos fóruns e sub-fóruns, eu queria adicionar este efeito também aos tópicos, observe:

Obrigado!

Olá!

Substitua seu JS por este:

Código:

$(document).on('ready', function() {
        $('.topiclist.forums .row .lastpost, dd.lastpost').prepend('<div class="avatar-index"><div>');
        $('.topiclist.forums .row .lastpost, dd.lastpost .avatar-index').each(function () {
            var profileUserURL = $(this).parent().children('span').children('strong').children('a').attr('href');
            $(this).html('<a href="' + profileUserURL + '" class="avatar-index-enlace"><img src="http://cdn1.iconfinder.com/data/icons/basicset/user_64.png" alt="No Avatar" /></a>');
            $(this).children('a').load(profileUserURL + ' .module:eq(0) img:eq(0)')
        });
    });

Até mais!

Bem, agora os do fórum deixaram de funcionar, aliás, não aparece mais nada no campo "Última Mensagem" do fórum, olhe:

Porém, nos tópicos a data ficou abaixo do avatar, deveria ter ficado ao lado, mais já obtivemos um resultado, olhe:

Obrigado!

Olá!

Troque todo e qualquer código JS por este:

Código:

$(document).on('ready', function() {
        $('.topiclist.forums .row .lastpost').prepend('<div class="avatar-index"><div>');
        $('.topiclist.forums .row .lastpost .avatar-index').each(function () {
            var profileUserURL = $(this).parent().children('span').children('strong').children('a').attr('href');
            $(this).html('<a href="' + profileUserURL + '" class="avatar-index-enlace"><img src="http://cdn1.iconfinder.com/data/icons/basicset/user_64.png" alt="No Avatar" /></a>');
            $(this).children('a').load(profileUserURL + ' .module:eq(0) img:eq(0)')
        });
    });

$(document).on('ready', function() {
        $('dd.lastpost').prepend('<div class="avatar-index"><div>');
        $('dd.lastpost .avatar-index').each(function () {
            var profileUserURL = $(this).parent().children('span').children('strong').children('a').attr('href');
            $(this).html('<a href="' + profileUserURL + '" class="avatar-index-enlace"><img src="http://cdn1.iconfinder.com/data/icons/basicset/user_64.png" alt="No Avatar" /></a>');
            $(this).children('a').load(profileUserURL + ' .module:eq(0) img:eq(0)')
        });
    });

Melhores cumprimentos,
seender

O resultado obtido nos fóruns:

E nos tópicos continua da mesma maneira:

Olá!

Poxa vida, só agora que fui ver o meu erro, nem acredito, aqui está o código:

Código:

$(document).on('ready', function() {
        $('dd.lastpost').prepend('<div class="avatar-index"><div>');
        $('dd.lastpost .avatar-index').each(function () {
            var profileUserURL = $(this).parent().children('span').children('strong').children('a').attr('href');
            $(this).html('<a href="' + profileUserURL + '" class="avatar-index-enlace"><img src="http://cdn1.iconfinder.com/data/icons/basicset/user_64.png" alt="No Avatar" /></a>');
            $(this).children('a').load(profileUserURL + ' .module:eq(0) img:eq(0)')
        });
    });

Melhores cumprimentos,
seender

Estamos indo muito bem! Agora foi a tentativa em que chegamos mais perto, no fórum está perfeito! Olhe:

O único erro foi nos tópicos, a data ficou no local errado o que gerou um grande espaço, olhe só:

Legenda:
Vermelho - Data da postagem está no lugar errado.
Verde - Lugar onde a data da postagem deveria está.
Obrigado!

Olá!

Remova todo o js e adicione este:

Código:

$(document).on('ready', function() {
        $('dd.lastpost').prepend('<div class="avatar-index"><div>');
        $('dd.lastpost .avatar-index').each(function () {
            var profileUserURL = $(this).parent().children('span').children('strong').children('a').attr('href');
            $(this).html('<a href="' + profileUserURL + '" class="avatar-index-enlace"><img src="http://cdn1.iconfinder.com/data/icons/basicset/user_64.png" alt="No Avatar" /></a>');
            $(this).children('a').load(profileUserURL + ' .module:eq(0) img:eq(0)')
        });
    });

jQuery(document).ready(function(){
$("dd.lastpost br").attr('style','clear','right');});

Melhores cumprimentos,
seender

Ficou excelentemente perfeito seender, agradeço de verdade a sua paciência, muito obrigado!
#Reputado.
#.
#