Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema
Como criar efeito hover
5 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
Página 1 de 1
Como criar efeito hover
como eu faço pra imagem mudah qdo eu passo o mouse em cima ?
um cara me deu um código q faz a imagem(as imagem q fica em cima, inicio, portal e etc) do portal muda, + eu qria as outras tb, como eu faço isso ?
o código q ele mandoh é assim:
um cara me deu um código q faz a imagem(as imagem q fica em cima, inicio, portal e etc) do portal muda, + eu qria as outras tb, como eu faço isso ?
o código q ele mandoh é assim:
- Código:
#i_icon_mini_portal {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/portal15.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
#i_icon_mini_portal:hover {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/portal17.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
Re: Como criar efeito hover
Olá loberto, seja bem-vindo a comunidade Forumeiros!
Poderei criar o código correcto, mas onde deseja aplicar esse efeito?
Será no menú de navegação do fórum?
Att, Needke
Boa noite e Seja bem-vindo ao FdF,
Como você acabou de se inscrever é importante que você esteja informado das nossas regras. Veja aqui alguns links importantes a saber :
Poderei criar o código correcto, mas onde deseja aplicar esse efeito?
Será no menú de navegação do fórum?
Att, Needke
Boa noite e Seja bem-vindo ao FdF,
Como você acabou de se inscrever é importante que você esteja informado das nossas regras. Veja aqui alguns links importantes a saber :
Needke- Hiper Membro
- Membro desde : 19/08/2009
Mensagens : 2761
Pontos : 4546
Re: Como criar efeito hover
Olá loberto,
todos os outros códigos que você quer só mudam a classe, aqui estão eles:
Espero que seja isto o que procuras.
Até Mais.
todos os outros códigos que você quer só mudam a classe, aqui estão eles:
Início:FAQ:
- Código:
#i_icon_mini_index {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/inicio14.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
#i_icon_mini_index:hover {
background-image: url(Link da Imagem);
padding: 30px 80px;
background-repeat: no-repeat;
}Buscar:
- Código:
#i_icon_mini_faq {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/faq10.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
#i_icon_mini_faq:hover {
background-image: url(Link da Imagem);
padding: 30px 80px;
background-repeat: no-repeat;
}Grupos:
- Código:
#i_icon_mini_search {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/buscar10.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
#i_icon_mini_search:hover {
background-image: url(Link da Imagem);
padding: 30px 80px;
background-repeat: no-repeat;
}Registrar:
- Código:
#i_icon_mini_groups {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/grupos10.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
#i_icon_mini_groups:hover {
background-image: url(Link da Imagem);
padding: 30px 80px;
background-repeat: no-repeat;
}Login:
- Código:
#i_icon_mini_register {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/regist10.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
#i_icon_mini_register:hover {
background-image: url(Link da Imagem);
padding: 30px 80px;
background-repeat: no-repeat;
}Editar Perfil:
- Código:
#i_icon_mini_login {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/login10.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
#i_icon_mini_login:hover {
background-image: url(Link da Imagem);
padding: 30px 80px;
background-repeat: no-repeat;
}Mensagem Privada:
- Código:
#i_icon_mini_profile {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/bolinh10.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
#i_icon_mini_profile:hover {
background-image: url(Link da Imagem);
padding: 30px 80px;
background-repeat: no-repeat;
}
- Código:
#i_icon_mini_message {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/mensag12.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
#i_icon_mini_message:hover {
background-image: url(Link da Imagem);
padding: 30px 80px;
background-repeat: no-repeat;
}
Obs: Você deve alterar os links do campo "background-image" das classes ":hover"
Já sabes onde adicionar certo?
Ascenda: Painel de Controle Visualização Imagens e Cores Cores Aba//Folha de Estilo CSS
Pegue o código, copie e cole na áre do código e depois clique em Validar.
Espero que seja isto o que procuras.
Até Mais.
Re: Como criar efeito hover
eu qria coloca pra qdo colocah o mouse a imagem dessa parte mudar ↓↓↓↓
como eu faço isso com tds ?
eu só cusigui fazeh com o portal
como eu faço isso com tds ?
eu só cusigui fazeh com o portal
Re: Como criar efeito hover
loberto escreveu:é isso msm spoiler, mto obrigado
vou ver se funciona
Não há de que, sempre que posso ajudo.
Qualquer problema ou dúvida pode perguntar aqui mesmo.
Até Mais.
Re: Como criar efeito hover
só ta faltando o de alguns
calendario, nova mensagem e sair
apenas esses
os q vc mandoh eu cusigui
calendario, nova mensagem e sair
apenas esses
os q vc mandoh eu cusigui
Re: Como criar efeito hover
Olá,
Calendário :
Sair :
Nova mensagem :
Até mais.
Calendário :
- Código:
#i_icon_mini_calendar {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/login10.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
#i_icon_mini_calendar:hover {
background-image: url(Link da Imagem);
padding: 30px 80px;
background-repeat: no-repeat;
}
Sair :
- Código:
#i_icon_mini_logout {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/login10.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
#i_icon_mini_logout:hover {
background-image: url(Link da Imagem);
padding: 30px 80px;
background-repeat: no-repeat;
}
Nova mensagem :
- Código:
#i_icon_mini_new_message {
background-image: url(http://i60.servimg.com/u/f60/15/70/05/80/login10.png);
padding: 30px 80px;
background-repeat: no-repeat;
}
#i_icon_mini_new_message:hover {
background-image: url(Link da Imagem);
padding: 30px 80px;
background-repeat: no-repeat;
}
Até mais.
Tópicos semelhantes
» [Dúvida] BBCodes para criar efeito Hover em mensagens
» Efeito hover
» Efeito hover
» Efeito hover no menu
» Efeito hover
» Efeito hover
» Efeito hover
» Efeito hover no menu
» Efeito hover
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
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos