Efeito hover no menu

[nejibyakugan]

• Descrição:

Eu queria saber como faço para colocar em meu fórum um efeito semelhante ao existente no meu deste fórum, quando passamos o mouse por cima, o botão escurece, eu queria saber como colocar este efeito em meu fórum.

---

• Informações:

Fórum:	http://pokemonmq.forumeiros.com/	Versão:	PUNBB
Tipo:	Pedido de código	Tags:	Efeito,hover

---

[Shek]

Boa noite!

Você poderia me indicar o local exato para qual deseja aplicar o efeito hover? Seria os ícones das mensagens?

Até mais!

[nejibyakugan]

No meu menu.

[Sennior]

Saudações,

Aceda à sua Folha de Estilo CSS:
Painel de Controle Visualização Imagens e Cores Cores Folha de Estilo CSS
Código:

Código:

a.mainmenu img  {filter:alpha(opacity=40);-moz-opacity: 0.4;opacity: 0.4;}a.mainmenu img:hover {filter:alpha(opacity=100);-moz-opacity: 1.0;opacity: 1.0;}

Coloque no inicio de teu CSS.

Até mais.

[nejibyakugan]

O código que você me enviou faz a imagem ficar com uma cor fraca, e quando o mouse passa por cima ele fica com a cor original, o código que eu quero é para as imagens ficarem com cor normal, e quando passar o mouse por cima, ficar escura.

[Lima 3005]

Código:

a.mainmenu img:hover  {filter:alpha(opacity=40);-moz-opacity: 0.4;opacity: 0.4;}a.mainmenu img {filter:alpha(opacity=100);-moz-opacity: 1.0;opacity: 1.0;}

Assim?

[nejibyakugan]

O código que me enviou faz o reverso do que o primeiro código, é por esse caminho mesmo, mas a imagem não está escurecendo, e sim ficando com uma cor mais fraca.

[Sennior]

Saudações,

Altere seu código pelo abaixo:

Código:

a.mainmenu img  {filter:alpha(opacity=100);-moz-opacity: 1.0;opacity: 1.0;}a.mainmenu img:hover {filter:alpha(opacity=40);-moz-opacity: 0.4;opacity: 0.4;}

Até mais.

[nejibyakugan]

Tem o mesmo efeito do amigo acima, a imagem fica mais clara, eu quero que fique mais escura(igual o do menu do FDF)

[Sennior]

Saudações,

Mas que para isso ocorra, o seu menu teria que ser por códigos CSS e não por imagens.
Tente este código:

Código:

.mainmenu img:hover {
filter: alpha(opacity=40);
-moz-opacity: 0.4;
opacity: 1.7;
}
.mainmenu img {
filter: alpha(opacity=40);
-moz-opacity: 0.4;
opacity: 0.7;
}

Veja se gosta desta maneira, pois é a unica maneira viável de se fazer já que seu menu é por imagens.

Até mais.

[nejibyakugan]

Teve o primeiro efeito, da imagem ficar com cor mais fraca, e voltar a imagem original quando passa o mouse por cima, eu queria que a imagem fosse a original e quando passar o mouse por cima, ela fiquei mais escura(nem que eu tenha que refazer botão a botão num tom escuro).

[Sennior]

Olá amigo,

Então, poderia fazer em um tom mais escuro? Assim eu poderia fazer do jeito que deseja.

Abraços.

[nejibyakugan]

O menu do meu fórum mudará hoje, então, até amanhã eu envio as imagens, para que seja feito o código, então, peço que aguarde enquanto isso, ok?

[Sennior]

Olá,

Tudo bem amigo.   

Abraços.

[nejibyakugan]

Pronto, refiz todos os botões, menos o de NEW MPs(não sei escurecer GIFs '-' )

Aqui estão as imagens mais escuras:

Spoiler:

[Sennior]

Saudações!

Aceda à tua "Folha de estilo CSS":
Painel de Controle    Visualização    Imagens e cores    Cores    Folha de estilo CSS

Código:

Código:

a.mainmenu:hover {filter: alpha(opacity=40);-moz-opacity: 0.4;opacity: 3.7;}a.mainmenu {filter: alpha(opacity=40);-moz-opacity: 0.4;opacity: 0.5;}

Melhores cumprimentos,
Sennior.

[nejibyakugan]

Mesmo efeito, fica uma fumaça branca na frente da imagem e quando passamos por cima a fumaça some, sabe o menu do FDF? Quando a gente passa o mouse por cima, a cor fica mais escura, é isso que eu quero.

[Dr.]

Saudações! Bem, o senhor deseja desta forma:

Código:

a.mainmenu:hover{
-htm-transform: all;
-htm-transition: 1s;
-moz-transform: all;
-moz-transition: 1s;
-o-transform: all;
-o-transition: 1s;
-webkit-filter: blur(0px);
-webkit-transform: all;
-webkit-transition: 1s;
background-color: XXX;
border-bottom: 3px solid XXX;
color: #fff;
filter: url(#blur-effect-1);
padding: 8px;
transform: all;
transition: 1s;
}

Vulgo que XXX representa a cor que o senhor deseja?

Atenciosamente.

[nejibyakugan]

Sem resultados.

[Dr.]

O senhor alterou o XXX pela cor hexadecimal desejada? (#000000 e #FFFFFF, por exemplo.)

Atenciosamente.

[nejibyakugan]

Sim, alterei, mas não há resultados.

[Alex Habilidade]

Olá,

O senhor forneceu as imagens que será o efeito 'Hover', peço que o senhor coloque as imagens normais em seu fórum, para que possamos fazer os teste para fazer o efeito hover desejado.

Quando colocar avise ok?

[nejibyakugan]

Sim, alterei.