Efeito hover nos botões

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

Resolvido Efeito hover nos botões

Mensagem por loberto em 13/11/10, 03:38 pm

da pra fazer efeito hover onde aparece novo tópico, citação, excluir tópico, responder, etc ?
se sim, como se faz ?
avatar

loberto
Nível 8

Masculino
Inscrito dia : 28/09/2010
Mensagens : 102
Pontos Ativos : 191

Ver perfil do usuário http://strung-city.forumeiros.com/

Resolvido Re: Efeito hover nos botões

Mensagem por Mikáá em 13/11/10, 03:57 pm

Olá!
Peço que leia o seguinte tópico:
Efeito Hover

Até mais.
avatar

Mikáá
Hiperativo

Masculino
Inscrito dia : 13/02/2010
Mensagens : 3155
Pontos Ativos : 4009

Ver perfil do usuário https://www.facebook.com/amo.e.odeio

Resolvido Re: Efeito hover nos botões

Mensagem por loberto em 13/11/10, 03:59 pm

foi eu q criei esse tópico, ele é do efeito hover na navegação, eu qria ver se da nas imagens do novo tópico, excluir mensagem, citação e etc.
avatar

loberto
Nível 8

Masculino
Inscrito dia : 28/09/2010
Mensagens : 102
Pontos Ativos : 191

Ver perfil do usuário http://strung-city.forumeiros.com/

Resolvido Re: Efeito hover nos botões

Mensagem por Mikáá em 13/11/10, 04:04 pm

Sendo assim, esprimente o seguinte código:

Código:
#profile-icons {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/portal15.png);
padding: 30px 80px;
background-repeat: no-repeat;
}

#profile-icons:hover {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/portal17.png);
padding: 30px 80px;
background-repeat: no-repeat;
}

Se o codigo em cima não der:

Código:
#ul.profile-icons {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/portal15.png);
padding: 30px 80px;
background-repeat: no-repeat;
}

#ul.profile-icons:hover {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/portal17.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
avatar

Mikáá
Hiperativo

Masculino
Inscrito dia : 13/02/2010
Mensagens : 3155
Pontos Ativos : 4009

Ver perfil do usuário https://www.facebook.com/amo.e.odeio

Resolvido Re: Efeito hover nos botões

Mensagem por loberto em 13/11/10, 04:07 pm

acho q esse continua sendo pro menu de navegação
avatar

loberto
Nível 8

Masculino
Inscrito dia : 28/09/2010
Mensagens : 102
Pontos Ativos : 191

Ver perfil do usuário http://strung-city.forumeiros.com/

Resolvido Re: Efeito hover nos botões

Mensagem por Mikáá em 13/11/10, 04:08 pm

Eu mudei as classes! Esprimente e diga algo!
avatar

Mikáá
Hiperativo

Masculino
Inscrito dia : 13/02/2010
Mensagens : 3155
Pontos Ativos : 4009

Ver perfil do usuário https://www.facebook.com/amo.e.odeio

Resolvido Re: Efeito hover nos botões

Mensagem por loberto em 13/11/10, 04:09 pm

testei, n mudo nd Triste
avatar

loberto
Nível 8

Masculino
Inscrito dia : 28/09/2010
Mensagens : 102
Pontos Ativos : 191

Ver perfil do usuário http://strung-city.forumeiros.com/

Resolvido Re: Efeito hover nos botões

Mensagem por Mikáá em 13/11/10, 04:11 pm

Esprimentou os 2 codiigos acima que lhe dei?
avatar

Mikáá
Hiperativo

Masculino
Inscrito dia : 13/02/2010
Mensagens : 3155
Pontos Ativos : 4009

Ver perfil do usuário https://www.facebook.com/amo.e.odeio

Resolvido Re: Efeito hover nos botões

Mensagem por loberto em 13/11/10, 04:12 pm

sim
avatar

loberto
Nível 8

Masculino
Inscrito dia : 28/09/2010
Mensagens : 102
Pontos Ativos : 191

Ver perfil do usuário http://strung-city.forumeiros.com/

Resolvido Re: Efeito hover nos botões

Mensagem por Needke em 13/11/10, 04:14 pm

Boa tarde,

Para criar esse efeito, deverá seguir esses passos simples:
Painel de Controlo Seta Visualização Seta Imagens e Cores Seta Cores
Selecione a aba 'Folha de estilo CSS' e adicione esse código:

Código:
#one {
filter:alpha(opacity=30); -moz-opacity: 0.3; opacity: 0.3;
}
#one:hover {
filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; cursor:allowed;
}

#i_reply {
filter:alpha(opacity=30); -moz-opacity: 0.3; opacity: 0.3;
}
#i_reply:hover {
filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; cursor:allowed;
}

.i_icon_quote {
filter:alpha(opacity=30); -moz-opacity: 0.3; opacity: 0.3;
}
.i_icon_quote:hover {
filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; cursor:allowed;
}

.i_icon_edit {
filter:alpha(opacity=30); -moz-opacity: 0.3; opacity: 0.3;
}
.i_icon_edit:hover {
filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; cursor:allowed;
}

.i_icon_delete {
filter:alpha(opacity=30); -moz-opacity: 0.3; opacity: 0.3;
}
.i_icon_delete:hover {
filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; cursor:allowed;
}

.i_icon_ip {
filter:alpha(opacity=30); -moz-opacity: 0.3; opacity: 0.3;
}
.i_icon_ip:hover {
filter:alpha(opacity=100); -moz-opacity: 1.0; opacity: 1.0; cursor:allowed;
}

Att, Needke


Última edição por Needke em 13/11/10, 04:26 pm, editado 1 vez(es)
avatar

Needke
Usuário experiente

Masculino
Inscrito dia : 19/08/2009
Mensagens : 2761
Pontos Ativos : 4546

Ver perfil do usuário

Resolvido Re: Efeito hover nos botões

Mensagem por loberto em 13/11/10, 04:19 pm

e onde eu coloco a imagem q vai aparecer qdo o mouse passar em cima ?
e é td junto assim ?
avatar

loberto
Nível 8

Masculino
Inscrito dia : 28/09/2010
Mensagens : 102
Pontos Ativos : 191

Ver perfil do usuário http://strung-city.forumeiros.com/

Resolvido Re: Efeito hover nos botões

Mensagem por Needke em 13/11/10, 04:33 pm

Exactamente, deverá adicionar esse código assim!
Nesse caso, será trabalhado com o efeito de opacidade nas imagens!

Caso deseja outro estilo, veja nesse tópico, resolve?
http://ajuda.forumeiros.com/-t33364.htm

Att, Needke
avatar

Needke
Usuário experiente

Masculino
Inscrito dia : 19/08/2009
Mensagens : 2761
Pontos Ativos : 4546

Ver perfil do usuário

Resolvido Re: Efeito hover nos botões

Mensagem por loberto em 14/11/10, 11:46 pm

opa, ficou ótimo, só falta o do novo tópico e o responder, mas esses eu vou querer com mudando de imagem qdo o mouse passa em cima, se vc conseguir, no lugar onde coloca o link da imagem coloca "LINK" ou coisa assim ok ?
o editar, citar, excluir e etc ficaram ótimos, mto obrigado
avatar

loberto
Nível 8

Masculino
Inscrito dia : 28/09/2010
Mensagens : 102
Pontos Ativos : 191

Ver perfil do usuário http://strung-city.forumeiros.com/

Resolvido Re: Efeito hover nos botões

Mensagem por Jorge-J em 14/11/10, 11:51 pm

este efeito serve para a versão Invision?
avatar

Jorge-J
Nível 5

Masculino
Inscrito dia : 07/11/2010
Mensagens : 45
Pontos Ativos : 58

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

Resolvido Re: Efeito hover nos botões

Mensagem por Convidad em 15/11/10, 12:55 am

@Jorge-J escreveu:este efeito serve para a versão Invision?

Olá boa noite,

Sim, este código funciona na versão invision, eu testei pessoalmente e funcionou. Se não me engano, as classes são as mesmas ou parecidas para todas as versões.

Espero ter lhe ajudado, até mais!

Convidad
Convidado


Resolvido Re: Efeito hover nos botões

Mensagem por Needke em 17/11/10, 07:51 pm

@loberto escreveu:opa, ficou ótimo, só falta o do novo tópico e o responder, mas esses eu vou querer com mudando de imagem qdo o mouse passa em cima, se vc conseguir, no lugar onde coloca o link da imagem coloca "LINK" ou coisa assim ok ?
o editar, citar, excluir e etc ficaram ótimos, mto obrigado

Boa noite novamente,

Por favor, veja se esse tópico resolve a sua questão: Piscada
http://ajuda.forumeiros.com/-t33364.htm

Att, Needke
avatar

Needke
Usuário experiente

Masculino
Inscrito dia : 19/08/2009
Mensagens : 2761
Pontos Ativos : 4546

Ver perfil do usuário

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