Mudar botões do menu ao passar o mouse Hitskin_logo Hitskin.com

Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema

Fórum dos Fóruns

Fórum grátis: ajuda e atendimento ao utilizador Forumeiros.com

Mudar botões do menu ao passar o mouse

4 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

Ir para baixo

Tópico resolvido Mudar botões do menu ao passar o mouse

Mensagem por driver25 24.03.13 0:10

Qual é minha questão:
Poderia me informar como fazer um efeito de quando eu passar o mouse sobre os botões do menu ele ir mudando de imagem? pra eu poder fazer um efeito de mudança de cor neles?

Ja tentei usar este código mais não deu certo:

#i_icon_mini_message:hover {
background-image: url(Endereço_da_sua_imagem);
}

Endereço do meu fórum:
http://testesalheios.forumeiros.com

Versão do fórum:
PHPBB3


Última edição por driver25 em 25.03.13 2:02, editado 2 vez(es)
driver25
driver25
*

Membro desde : 18/03/2013
Mensagens : 31
Pontos : 37

http://testesalheios.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Mudar botões do menu ao passar o mouse

Mensagem por Sennior 24.03.13 0:13

Saudações!

Troque por este:

Código:
.mainmenu:hover {
background-image: url(Endereço_da_sua_imagem) !important;
}

Até mais!
Sennior
Sennior
Principal Contribuidor
Principal Contribuidor

Membro desde : 10/06/2011
Mensagens : 16379
Pontos : 20903

https://ajuda.forumeiros.com/forum https://www.facebook.com/GladstonHenriq https://twitter.com/UmGladston

Ir para o topo Ir para baixo

Tópico resolvido Re: Mudar botões do menu ao passar o mouse

Mensagem por driver25 24.03.13 4:14

Não funciona =/
driver25
driver25
*

Membro desde : 18/03/2013
Mensagens : 31
Pontos : 37

http://testesalheios.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Mudar botões do menu ao passar o mouse

Mensagem por Konai 24.03.13 4:20

Olá querido,

Substitua o código passado pelo Mikéé, por este:
ul.linklist li a img {
background:url(IMAGEM);
cursor:allowed;
}
ul.linklist a img:hover {
background:url(IMAGEM_HOVER);
cursor:allowed;
}

Onde está em negrito é a url da imagem. A IMAGEM seria o botão normal e a IMAGEM_HOVER seria o botão que ao passar o mouse apareceria.

Cordialmente,
Dr.House Muito feliz
Konai
Konai
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Mudar botões do menu ao passar o mouse

Mensagem por driver25 24.03.13 5:12

Também já tinha usado este código tentei novamente e não deu nada, a imagem do menu continua estática quando passo o mouse =/
driver25
driver25
*

Membro desde : 18/03/2013
Mensagens : 31
Pontos : 37

http://testesalheios.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Mudar botões do menu ao passar o mouse

Mensagem por Konai 24.03.13 5:17

Olá!

Veja as classes CSS ligadas à cada imagem do menu:
#i_icon_mini_index { Corresponde à imagem início/Fórum.
#i_icon_mini_portal { Corresponde à imagem portal.
#i_icon_mini_calendar { Corresponde à imagem calendário.
#i_icon_mini_faq { Corresponde à imagem Faq/Perguntas e respostas criadas por si no painel de controle.
#i_icon_mini_search { Corresponde à imagem buscar.
#i_icon_mini_index { Corresponde à imagem início/Fórum.
#i_icon_mini_members { Corresponde à imagem de membros do fórum.
#i_icon_mini_groups { Corresponde à imagem grupos.
#i_icon_mini_profile { Corresponde à imagem perfil.
#i_icon_mini_message { Corresponde à imagem do link do menu MP.
ul.navlinks span.new-message { Corresponde à imagem do link do menu Nova MP.
#i_icon_mini_logout { Corresponde à imagem do link do menu Sair.
i_icon_mini_login { Corresponde à imagem do link do menu Login/Entrar.
i_icon_mini_register { Corresponde à imagem do link do menu Registrar/Cadastrar.
Agora para colocar uma imagem para exibir quando passar o mouse em cima do link veja:

#i_icon_mini_message:hover {
background-image: url(Endereço_da_sua_imagem);
}
Isso acima é um exemplo, deverá ser modificado a parte "#i_icon_mini_message", dependendo da escolha das classes.

O código depois de produzido, deverá ser adicionado em:
Painel de controle :seta2: Visualização :seta2: Imagens e cores :seta2: Cores :seta2: Aba 'Folha estilo CSS'

Cordialmente,
Dr.House Muito feliz
Konai
Konai
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Mudar botões do menu ao passar o mouse

Mensagem por driver25 24.03.13 13:31

Cara eu já catei tudo que é código postado aqui no fórum e nenhum está funcionando, este tbm foi um desses.

O único que funcionou parcialmente foi um javascript mais estava bugado pois ele mudava a imagem ao passar o mouse mais não voltava pra antiga quando tirava o mouse de cima.
driver25
driver25
*

Membro desde : 18/03/2013
Mensagens : 31
Pontos : 37

http://testesalheios.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Mudar botões do menu ao passar o mouse

Mensagem por Konai 24.03.13 14:56

Olá senhor Driver,

Estranho.. Louco o código que lhe passei é funcional em meu fórum, testei antes de posta-lo.

Bom.. já que não funciona poderia me passar o código Javascript? Tentarei concerta-lo para o senhor.

Cordialmente,
Dr.House Muito feliz
Konai
Konai
Membro Entusiasta

Membro desde : 07/08/2010
Mensagens : 6045
Pontos : 7550

http://narutongo.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Mudar botões do menu ao passar o mouse

Mensagem por driver25 24.03.13 16:27

Código:
$(document).ready(function(){$('a.mainmenu img[src="LINK1"]').mouseover(function(){$(this).attr('src','LINK2')})});

Ai está =D
driver25
driver25
*

Membro desde : 18/03/2013
Mensagens : 31
Pontos : 37

http://testesalheios.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Mudar botões do menu ao passar o mouse

Mensagem por -luiz,, 25.03.13 0:19

Olá um solução em css:

/*Abaixo href="/" é referente ao botão forum (inicio)*/
a.mainmenu[href="/"]{
background-image: url(Endereço_da_sua_imagem);
}
a.mainmenu[href="/"]:hover{
background-image: url(Endereço_da_sua_imagem_hover);
}

/*Abaixo href="/calendar" é referente ao botão calendario*/
a.mainmenu[href="/calendar"]{
background-image: url(Endereço_da_sua_imagem);
}
a.mainmenu[href="/calendar"]:hover{
/*Criado por -luiz,,*/
background-image: url(Endereço_da_sua_imagem_hover);
}

E assim você faz com todos os links, "IMPORTANTE" remova todos as imagens do menu, deixando transparente.
Painel de Controle Seta Visualização Seta Imagens e Cores Seta Gestão das Imagens
Todos os campos referentes ao Menu Seta https://2img.net/i/fa/empty.gif
Solução em JS:


img1="img que esta no menu";//Img atual //
img2="Img que ficará no menu";//Img hover//
atu_img = function(){$(this).attr('src',img1);}nova_img = function(){//Criado por -luiz,,//[/font]$(this).attr('src',img2)};$(document).ready(function(){$('a.mainmenu img[src="'+img1+'"]').hover(nova_img,atu_img)});
Acho essa mais "Lenta".

Recomando usar a CSS.
-luiz,,
-luiz,,
**

Membro desde : 05/07/2010
Mensagens : 88
Pontos : 101

http://clickhabbo.6te.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Mudar botões do menu ao passar o mouse

Mensagem por driver25 25.03.13 0:54

Fiz justamente como está ai e não está funcionando.

Olha ai:
Código:
/*Abaixo href="/" é referente ao botão forum (inicio)*/
a.mainmenu[href="/"]{
background-image: url(http://i75.servimg.com/u/f75/16/15/60/55/forum10.jpg);
}
a.mainmenu[href="/"]:hover{
background-image: url(http://hitskin.com/themes/14/74/29/i_icon_mini_members.gif);
}

O java tbm não deu.
driver25
driver25
*

Membro desde : 18/03/2013
Mensagens : 31
Pontos : 37

http://testesalheios.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Mudar botões do menu ao passar o mouse

Mensagem por -luiz,, 25.03.13 1:19

CSS:
a.mainmenu[href="/"] img{
background-image: url(https://i.servimg.com/u/f75/16/15/60/55/forum10.jpg);
width: 90px!important;
height: 37px!important;
}
a.mainmenu[href="/"]:hover img{
background-image: url(http://hitskin.com/themes/14/74/29/i_icon_mini_members.gif);
}

JS:
img2="https://i.servimg.com/u/f75/16/15/60/55/forum10.jpg";//Img atual //
img1="http://hitskin.com/themes/14/74/29/i_icon_mini_members.gif";//Img hover//
atu_img = function(){$(this).attr('src',img1);};nova_img = function(){$(this).attr('src',img2)};$(document).ready(function(){$('a.mainmenu img[src="'+img1+'"]').hover(nova_img,atu_img)});

Resulta?
-luiz,,
-luiz,,
**

Membro desde : 05/07/2010
Mensagens : 88
Pontos : 101

http://clickhabbo.6te.net/

Ir para o topo Ir para baixo

Tópico resolvido Re: Mudar botões do menu ao passar o mouse

Mensagem por driver25 25.03.13 2:01

Perfeito Muito feliz
Muito obrigado Feliz
driver25
driver25
*

Membro desde : 18/03/2013
Mensagens : 31
Pontos : 37

http://testesalheios.forumeiros.com/

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

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

 
Permissões neste sub-fórum
Não podes responder a tópicos