InícioEfeito de Avatar
2 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Efeito de Avatar
por IsmaelS. 09.09.14 15:57
- Descrição:
Gostaria saber se era possível ter este efeito de avatar no índice do fórum:
http://narutoeternal.ativoforum.com/
- Informações:
| Fórum: | http://kodactheme.criaforum.com/ | Versão: | PHPBB2 |
| Tipo: | Pedido de código | Tags: | Efeito,Avatar |
IsmaelS.- Hiper Membro
- Membro desde : 24/11/2012
Mensagens : 2994
Pontos : 4142 -
Re: Efeito de Avatar
por waghcwb 09.09.14 19:57
Pode ser mais especifico a exatamente qual efeito o senhor deseja? é aquele ao passar o mouse em cima dos avatares no index ou o efeito completo deles em si?
waghcwb- Membro
- Membro desde : 07/09/2012
Mensagens : 734
Pontos : 1097 -
IsmaelS.- Hiper Membro
- Membro desde : 24/11/2012
Mensagens : 2994
Pontos : 4142 -
Re: Efeito de Avatar
por waghcwb 09.09.14 20:53
Teste o seguinte
- Código:
.lastpost-avatar img {
background: #FFF;
border: 1px solid #D5D5D5;
border-radius: 50%;
box-shadow: 0 2px 2px rgba(0,0,0,.1);
height: 40px;
padding: 1px;
transition: all 1s;
width: 40px;
}
.lastpost-avatar img:hover {
border-color: #A1A1A1;
border-radius: 1px;
box-shadow: 0 2px 2px rgba(0,0,0,.2);
}
waghcwb- Membro
- Membro desde : 07/09/2012
Mensagens : 734
Pontos : 1097 -
Re: Efeito de Avatar
por IsmaelS. 09.09.14 23:01
Seria possível colocar mais abaixo o avatar? Ou seja mover mais para o centro, que ao colocar o mouse em cima se reparar ele fica um bocadinho acima se possível colocar centrado!
IsmaelS.- Hiper Membro
- Membro desde : 24/11/2012
Mensagens : 2994
Pontos : 4142 -
Re: Efeito de Avatar
por waghcwb 09.09.14 23:54
Basta que o senhor use a seguinte propriedade
Note que o valor é negativo ( - )
Veja um exemplo:
Basta usar o valor que o senhor deseja. Para os outros lados é a mesma coisa
margin-left para esquerda
margin-right para direita
margin-top para cima
margin-bottom para baixo
- Código:
margin-top: -VALOR;
Note que o valor é negativo ( - )
Veja um exemplo:
- Código:
.lastpost-avatar img {
background: #FFF;
border: 1px solid #D5D5D5;
border-radius: 50%;
box-shadow: 0 2px 2px rgba(0,0,0,.1);
height: 40px;
padding: 1px;
transition: all 1s;
width: 40px;
/* NOTE A PROPRIEDADE AQUI */
margin-top: -10px;
}
Basta usar o valor que o senhor deseja. Para os outros lados é a mesma coisa
margin-left para esquerda
margin-right para direita
margin-top para cima
margin-bottom para baixo
waghcwb- Membro
- Membro desde : 07/09/2012
Mensagens : 734
Pontos : 1097 -
Re: Efeito de Avatar
por IsmaelS. 10.09.14 0:56
Olá,
No fórum quero deixar como está, mas nos sub-fóruns queria mexer também tem possibilidade?
No fórum quero deixar como está, mas nos sub-fóruns queria mexer também tem possibilidade?
IsmaelS.- Hiper Membro
- Membro desde : 24/11/2012
Mensagens : 2994
Pontos : 4142 -
Re: Efeito de Avatar
por waghcwb 11.09.14 18:46
Apenas nos subforuns? Se for, no caso o senhor pode fazer a alteração de forma global e na mensagem da homepage inserir a estilização que deseja apenas na homepage.
Ou seja, faça a alteração como deseja no CSS normal com as margens que deseja, e na mensagem da homepage altere as margens para 0
Exemplo
Ou seja, faça a alteração como deseja no CSS normal com as margens que deseja, e na mensagem da homepage altere as margens para 0
Exemplo
- Código:
.lastpost-avatar img {
margin-top: 0;
}
waghcwb- Membro
- Membro desde : 07/09/2012
Mensagens : 734
Pontos : 1097 -
Re: Efeito de Avatar
por IsmaelS. 11.09.14 19:29
Então eu desejo assim na página inicial:
Tenho que colocar esse na homepage, e este na .CSS?
- Código:
.lastpost-avatar img {
background: #FFF;
border: 1px solid #D5D5D5;
border-radius: 50%;
box-shadow: 0 2px 2px rgba(0,0,0,.1);
height: 40px;
padding: 1px;
transition: all 1s;
width: 40px;
margin-top: 4;
}
.lastpost-avatar img:hover {
border-color: #A1A1A1;
border-radius: 1px;
box-shadow: 0 2px 2px rgba(0,0,0,.2);
}
Tenho que colocar esse na homepage, e este na .CSS?
- Código:
.lastpost-avatar img {
margin-top: 0;
}
IsmaelS.- Hiper Membro
- Membro desde : 24/11/2012
Mensagens : 2994
Pontos : 4142 -
Re: Efeito de Avatar
por waghcwb 11.09.14 20:01
Na verdade seria o contrário amigo, achei que entendesse um pouco de CSS por isso não deixei exemplos muito elucidativos, mas vamos lá então
Note seu código
Não é errado não atribuir um valor especifico para um valor, porém cada navegador vai entender esse valor de uma maneira diferente, o "4" para você pode não ser o mesmo para mim, entende? Por isso, procure declarar o valor em pixels ou outra unidade de medida
Poderia ser
Para inserir um CSS na homepage não basta colar ele lá, vai precisar inserir entre as tags "style", assim:
Tenta fazer isso, se tiver dificuldades nos avise.
Note seu código
- Código:
.lastpost-avatar img {
background: #FFF;
border: 1px solid #D5D5D5;
border-radius: 50%;
box-shadow: 0 2px 2px rgba(0,0,0,.1);
height: 40px;
padding: 1px;
transition: all 1s;
width: 40px;
margin-top: 4;
}
.lastpost-avatar img:hover {
border-color: #A1A1A1;
border-radius: 1px;
box-shadow: 0 2px 2px rgba(0,0,0,.2);
}
Não é errado não atribuir um valor especifico para um valor, porém cada navegador vai entender esse valor de uma maneira diferente, o "4" para você pode não ser o mesmo para mim, entende? Por isso, procure declarar o valor em pixels ou outra unidade de medida
- Código:
margin-top: 4;
Poderia ser
- Código:
margin-top: 4px;
Para inserir um CSS na homepage não basta colar ele lá, vai precisar inserir entre as tags "style", assim:
- Código:
<style type="text/css">/* Códigos aqui */</styles>
Tenta fazer isso, se tiver dificuldades nos avise.
waghcwb- Membro
- Membro desde : 07/09/2012
Mensagens : 734
Pontos : 1097 -
Re: Efeito de Avatar
por IsmaelS. 11.09.14 20:07
Olá,
Fiz o que pediu colocar em "4px", agora na parte de homepage que código coloco ao certo dentro?
Fiz o que pediu colocar em "4px", agora na parte de homepage que código coloco ao certo dentro?
IsmaelS.- Hiper Membro
- Membro desde : 24/11/2012
Mensagens : 2994
Pontos : 4142 -
Re: Efeito de Avatar
por waghcwb 11.09.14 20:11
Isso no CSS
E isso na mensagem da home
- Código:
.lastpost-avatar img {
background: #FFF;
border: 1px solid #D5D5D5;
border-radius: 50%;
box-shadow: 0 2px 2px rgba(0,0,0,.1);
height: 40px;
padding: 1px;
transition: all 1s;
width: 40px;
margin-top: 4px;
}
.lastpost-avatar img:hover {
border-color: #A1A1A1;
border-radius: 1px;
box-shadow: 0 2px 2px rgba(0,0,0,.2);
}
E isso na mensagem da home
- Código:
<style type="text/css">.lastpost-avatar img {
margin-top: 0;
}</style>
waghcwb- Membro
- Membro desde : 07/09/2012
Mensagens : 734
Pontos : 1097 -
Re: Efeito de Avatar
por IsmaelS. 11.09.14 20:15
Fiz o que pediu mas não notei nada de diferente mas aqui fica uma print como quero:
Veja ao passar o mouse o efeito fica muito abaixo das informações ao lado direito, eu queria alinhado se possível, percebeu?
Veja ao passar o mouse o efeito fica muito abaixo das informações ao lado direito, eu queria alinhado se possível, percebeu?
IsmaelS.- Hiper Membro
- Membro desde : 24/11/2012
Mensagens : 2994
Pontos : 4142 -
Re: Efeito de Avatar
por waghcwb 12.09.14 15:49
Amigo, você fez algo errado.. O valor dos pixels la não estão negativos, assim eles ficam mais para baixo ainda
Veja
Altere o valor para 4 pixels negativos
Veja
Altere o valor para 4 pixels negativos
- Código:
margin-top: -4px;
waghcwb- Membro
- Membro desde : 07/09/2012
Mensagens : 734
Pontos : 1097 -
IsmaelS.- Hiper Membro
- Membro desde : 24/11/2012
Mensagens : 2994
Pontos : 4142 -
Re: Efeito de Avatar
por waghcwb 12.09.14 19:33
Tópico movido de Questões sobre aparência do fórum para Questões resolvidas.
waghcwb- Membro
- Membro desde : 07/09/2012
Mensagens : 734
Pontos : 1097 -
Tópicos semelhantes» Efeito no avatar do usuário
» Efeito no Avatar
» Efeito no avatar
» Remover efeito no avatar
» Efeito Croocket no avatar
» Efeito no Avatar
» Efeito no avatar
» Remover efeito no avatar
» Efeito Croocket no avatar
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos