Menu, muda de imagem quando o mouse passa por cima

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

Resolvido Menu, muda de imagem quando o mouse passa por cima

Mensagem por Itachi Uchiha em 29/10/10, 11:26 am

Olá, a todos.
Queria saber como faz para que quando um membro passa o mouse sobre o menu, o menu muda de imagem.

Ex:

No menu de tal fórum tem este botão:
http://img821.imageshack.us/img821/1930/semnoobotes01.png

Depois quando o mouse passa por cima dela muda para o seguinte botão:
http://img152.imageshack.us/img152/1930/semnoobotes01.png

Até mais

avatar

Itachi Uchiha
Membro do Fórum

Masculino
Inscrito dia : 14/06/2010
Mensagens : 1292
Pontos Ativos : 1860

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

Resolvido Re: Menu, muda de imagem quando o mouse passa por cima

Mensagem por Taqueto em 29/10/10, 11:42 am

Olá!

Tente este código:

a.mainmenu {
background:url(IMAGEM);
cursor:allowed;
}
a.mainmenu:hover {
background:url(IMAGEM_HOVER);
cursor:allowed;
}

Vermelho - Imagem normal
Azul - Imagem com o mouse em cima.




Adicione este código na folha CSS.
Espero que consiga.
Abraços!
avatar

Taqueto
Nível 8

Masculino
Inscrito dia : 08/09/2010
Mensagens : 149
Pontos Ativos : 216

Ver perfil do usuário http://kingscross.forumeiro.com/

Resolvido Re: Menu, muda de imagem quando o mouse passa por cima

Mensagem por Itachi Uchiha em 29/10/10, 08:45 pm

Huuuum....
Tem um jeito de colocar um código CSS, para que os botões fiquem cinzas e ae quando se passa o mouse em cima deles eles ficam da cor natural?

Até mais
avatar

Itachi Uchiha
Membro do Fórum

Masculino
Inscrito dia : 14/06/2010
Mensagens : 1292
Pontos Ativos : 1860

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

Resolvido Re: Menu, muda de imagem quando o mouse passa por cima

Mensagem por Solkis em 29/10/10, 08:56 pm

Boa noite,

Veja se não é o que procura:
http://ajuda.forumeiros.com/-t15695.htm

Até mais.
avatar

Solkis
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/01/2008
Mensagens : 9983
Pontos Ativos : 12074

Ver perfil do usuário http://ajuda.forumeiros.com
  • 0

Resolvido Re: Menu, muda de imagem quando o mouse passa por cima

Mensagem por Taqueto em 29/10/10, 09:02 pm

Olá, seth's!
Tem sim... Isso se chama opacidade no menu.
Leia este Tutorial e aprenderá:
Efeito de Opacidade nas imagens do Menu


Espero que consiga. Abraços!
avatar

Taqueto
Nível 8

Masculino
Inscrito dia : 08/09/2010
Mensagens : 149
Pontos Ativos : 216

Ver perfil do usuário http://kingscross.forumeiro.com/

Resolvido Re: Menu, muda de imagem quando o mouse passa por cima

Mensagem por Itachi Uchiha em 29/10/10, 09:07 pm

Não, não é efeito de opacidade.
Quero saber um jeito de deixar o menu de cor cinza e quando um membro passar o mouse por cima voltar na cor normal.
Até mais.
avatar

Itachi Uchiha
Membro do Fórum

Masculino
Inscrito dia : 14/06/2010
Mensagens : 1292
Pontos Ativos : 1860

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

Resolvido Re: Menu, muda de imagem quando o mouse passa por cima

Mensagem por Solkis em 29/10/10, 09:25 pm

Boa noite,

Aqui está o código para o que deseja:
Código:
a.mainmenu img {
filter:gray;
}
a.mainmenu img:hover {
filter:none;
}
Até mais.
avatar

Solkis
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 26/01/2008
Mensagens : 9983
Pontos Ativos : 12074

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

Resolvido Re: Menu, muda de imagem quando o mouse passa por cima

Mensagem por Itachi Uchiha em 29/10/10, 10:32 pm

Se for para colocar no CSS, não deu certo.

Até mais.
avatar

Itachi Uchiha
Membro do Fórum

Masculino
Inscrito dia : 14/06/2010
Mensagens : 1292
Pontos Ativos : 1860

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

Resolvido Re: Menu, muda de imagem quando o mouse passa por cima

Mensagem por Taqueto em 30/10/10, 12:15 pm

Então faça o seguinte. Crie uma imagem na tonalidade de cinza que deseja e outra imagem em tonalidade normal de cor, então aplique o código que eu havia leh passado:



a.mainmenu {
background:url(IMAGEM);
cursor:allowed;
}
a.mainmenu:hover {
background:url(IMAGEM_HOVER);
cursor:allowed;
}

IMAGEM - Endereço da Imagem Normal
IMAGEM_HOVER - Endereço da Imagem com o mouse sobre ela
avatar

Taqueto
Nível 8

Masculino
Inscrito dia : 08/09/2010
Mensagens : 149
Pontos Ativos : 216

Ver perfil do usuário http://kingscross.forumeiro.com/

Resolvido Re: Menu, muda de imagem quando o mouse passa por cima

Mensagem por Itachi Uchiha em 30/10/10, 06:40 pm

Bom, isso não o que eu espero, pois quero aplicar no menu.
E cada botão do menu tem um link para ir a certa página. E esse código é só para passar o mouse por cima e mudar a imagem. E também acho que não será possivel colocar no menu.
Mas mesmo assim vou tentar.

'Acabei de testar, e não deu certo'

Até mais.


Última edição por seth's em 30/10/10, 06:43 pm, editado 1 vez(es) (Razão : testamento)
avatar

Itachi Uchiha
Membro do Fórum

Masculino
Inscrito dia : 14/06/2010
Mensagens : 1292
Pontos Ativos : 1860

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

Resolvido Re: Menu, muda de imagem quando o mouse passa por cima

Mensagem por Taqueto em 31/10/10, 08:20 pm

Olá, seth's!
Para cada imagem do menu, faça uma outra imagem, no caso a com o mouse em cima, e para cada uma então, coloque um código na folha CSS.
Tente assim...
avatar

Taqueto
Nível 8

Masculino
Inscrito dia : 08/09/2010
Mensagens : 149
Pontos Ativos : 216

Ver perfil do usuário http://kingscross.forumeiro.com/

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