Efeito de sombra no AVATAR

Suporte à dúvidas gerais relacionadas ao phpBB.
Avatar do usuário
CristianoCMP
Novato
Novato
Mensagens: 100
Registrado em: 06 Set 2016, 08:55

Efeito de sombra no AVATAR

Mensagem por CristianoCMP »

Olá pessoal tudo bem?
Bom dei uma lida por aqui e no forum phpbb.com e nao consegui achar nada sobre o assunto, mas creio que ninguem ainda quis inventar isto..

Seria um efeito no AVATAR, por ex: uma sombra nos AVATARES do forum, e ao passar o mouse sobre ele uma borda branca no avatar externa, e some a sombra.

Se alguem souber de algo... ou extensão que faça isto! Lembrando q procurei alguma extensão e nao achei!

Grato a todos.
Avatar do usuário
LucasLV
Moderador
Moderador
Mensagens: 711
Registrado em: 18 Out 2013, 04:40

Re: Efeito de sombra no AVATAR

Mensagem por LucasLV »

Não testei, mas seria algo mais ou menos assim. Abre seu content.css ou então adiciona em seu custom.css:

Código: Selecionar todos

.postprofile .avatar img {
box-shadow: 3px 3px 20px 5px #000;
-moz-box-shadow: 3px 3px 20px 5px #000;
-webkit-box-shadow: 3px 2px 10px 5px #000;
-o-box-shadow: 3px 3px 20px 5px #000;
}
Isso dará o aspecto de sombra aos avatares, altere em 3px ou 20px pra aumentar ou diminuir.

Pra desaparecer ao passar o mouse e a borda branca aparecer, adiciona:

Código: Selecionar todos

.postprofile .avatar img:hover {
box-shadow: none;
border: 3px solid #fff;
  -webkit-transition: all 0.7s linear;
  -moz-transition: all 0.7s linear;
  -o-transition: all 0.7s linear;
  transition: all 0.7s linear; /* uma transilção pra não ficar um efeito seco ao passar o mouse */
}
Testa ai e me fala
// PRECISA DE UM TRABALHO PARA SEU SITE/FORUM? Contate-me...
Avatar do usuário
CristianoCMP
Novato
Novato
Mensagens: 100
Registrado em: 06 Set 2016, 08:55

Re: Efeito de sombra no AVATAR

Mensagem por CristianoCMP »

Nossa como eu nao tinha visto isto antes kkkkkkk

Funcionou Lucas Muito Obrigadoooooo

Outra coisa, e quanto tempo heimmmm Forum la bombando!!!! Graças a Deusss, e 99% das alterações ainda são creditos seus !!!

OBS so um detalhe, a sombra ficou somente para 1 lado, lado esquerdo, seria possivel ela ficar na diagonal pegando a parte do lado e de cima tambem? xD

Abraçosssssssss
Avatar do usuário
LucasLV
Moderador
Moderador
Mensagens: 711
Registrado em: 18 Out 2013, 04:40

Re: Efeito de sombra no AVATAR

Mensagem por LucasLV »

CristianoCMP escreveu: 30 Ago 2019, 09:15 Nossa como eu nao tinha visto isto antes kkkkkkk

Funcionou Lucas Muito Obrigadoooooo

Outra coisa, e quanto tempo heimmmm Forum la bombando!!!! Graças a Deusss, e 99% das alterações ainda são creditos seus !!!

OBS so um detalhe, a sombra ficou somente para 1 lado, lado esquerdo, seria possivel ela ficar na diagonal pegando a parte do lado e de cima tambem? xD

Abraçosssssssss
Boas, que bom que tudo está correndo bem.
Tente ir alterando os px do box-shadow pra chegar a um resultado que te agrade.
// PRECISA DE UM TRABALHO PARA SEU SITE/FORUM? Contate-me...
Avatar do usuário
CristianoCMP
Novato
Novato
Mensagens: 100
Registrado em: 06 Set 2016, 08:55

Re: Efeito de sombra no AVATAR

Mensagem por CristianoCMP »

Sim alterei tudo os número ali e a sombra apenas se prolonga pela lateral kkkkk ela limita ao tamanho do avatar 🤣🤣🤣
Avatar do usuário
Alma
Novato
Novato
Mensagens: 10
Registrado em: 18 Set 2017, 12:52
Localização: França

Re: Efeito de sombra no AVATAR

Mensagem por Alma »

Hello
E definindo os 2 primeiros valores para 0, deve estar tudo bem.
Por exemplo:

Código: Selecionar todos

box-shadow: 0 0 10px 3px #000;
Cordialmente
Avatar do usuário
CristianoCMP
Novato
Novato
Mensagens: 100
Registrado em: 06 Set 2016, 08:55

Re: Efeito de sombra no AVATAR

Mensagem por CristianoCMP »

Alma escreveu: 05 Set 2019, 05:53 Hello
E definindo os 2 primeiros valores para 0, deve estar tudo bem.
Por exemplo:

Código: Selecionar todos

box-shadow: 0 0 10px 3px #000;
Cordialmente
Nada.... mesma coisa, nao muda! tudo igual
henrique.seven2011
Moderador
Moderador
Mensagens: 984
Registrado em: 23 Mar 2012, 13:50
Nome Real: Saulo Henrique

Re: Efeito de sombra no AVATAR

Mensagem por henrique.seven2011 »

Cloud de Verdade?! Recomendo: Vultr, DigitalOcean e LetsCloud | Freelancer a disposição!
Responder