Menu com efeito hover

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

Resolvido Menu com efeito hover

Mensagem por Pika_mestre em 28/06/11, 04:37 pm

Qual é sua questão:
Bom! Boa tarde a todos! Já vi que em muitos fóruns, quando se coloca o mouse sobre aquele quadro que divide tópicos e fóruns, outra cor aparece, e quero fazer isso no meu fórum, como faço?

Que medidas você tomou para corrigir o problema:
VIm ao FdF

Apresente-nos imagens do problema (se necessário):
Sem o mouse apontando para o quadro ele fica assim:

http://i48.servimg.com/u/f48/16/38/63/03/sem_ef10.jpg

Com o mouse apontando para o quadro ele fica assim:

http://i48.servimg.com/u/f48/16/38/63/03/com_ef10.jpg

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

Versão do fórum:
PUNBB


Última edição por josedaPM em 30/06/11, 03:20 pm, editado 1 vez(es)
avatar

Pika_mestre
Usuário avançado

Masculino
Inscrito dia : 28/06/2011
Mensagens : 362
Pontos Ativos : 580

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

Resolvido Re: Menu com efeito hover

Mensagem por Convidad em 28/06/11, 04:47 pm

Boa quetão tambem me enteressei por favor ajude-nos!

O meu fórum é phpBB3

Convidad
Convidado


Resolvido Re: Menu com efeito hover

Mensagem por Nicker em 28/06/11, 05:36 pm

Olá,
Isto é mais conhecido, como campo houver. Para modificar está área basta aceder ao : Painel de controle Seta Visualização Seta Imagens e cores Seta Cores Seta Procure pela aba "Cores de Fundo", agora localize a aba "Cor do campo Hover :". Basta modificar para a cor deseja, que vai obter o resultado desejado, não esqueça de salvar.
Até mais.
avatar

Nicker
Usuário destaque

Masculino
Inscrito dia : 04/05/2010
Mensagens : 549
Pontos Ativos : 780

Ver perfil do usuário http://www.publieiros.com/

Resolvido Re: Menu com efeito hover

Mensagem por Convidad em 28/06/11, 05:41 pm

MUITO OBRIGADO!
ABRAÇOS!
-------------
Existe alguma forma de eu fazer ele aparecer a cor suavemente?

Convidad
Convidado


Resolvido Re: Menu com efeito hover

Mensagem por burlador em 28/06/11, 06:33 pm

se conseguir arranjar o css dessa parte acho que consigo fazer

burlador
Nível 9

Masculino
Inscrito dia : 25/01/2010
Mensagens : 200
Pontos Ativos : 290

Ver perfil do usuário http://google.com

Resolvido Re: Menu com efeito hover

Mensagem por Otaviodg em 28/06/11, 07:06 pm

thalesaugusto escreveu:Existe alguma forma de eu fazer ele aparecer a cor suavemente?

Está serve?? #F6F4D0 caso não me avise que coloco outra
avatar

Otaviodg
Membro do Fórum

Masculino
Inscrito dia : 11/06/2011
Mensagens : 1295
Pontos Ativos : 1735

Ver perfil do usuário

Resolvido Re: Menu com efeito hover

Mensagem por Convidad em 29/06/11, 11:22 am

po cara vlw. Ficou muito bom!
Vlw mesmo.
^^

Convidad
Convidado


Resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre em 29/06/11, 01:18 pm

@Nicker escreveu:Olá,
Isto é mais conhecido, como campo houver. Para modificar está área basta aceder ao : Painel de controle Seta Visualização Seta Imagens e cores Seta Cores Seta Procure pela aba "Cores de Fundo", agora localize a aba "Cor do campo Hover :". Basta modificar para a cor deseja, que vai obter o resultado desejado, não esqueça de salvar.
Até mais.

Ainda não deu certo! Fui lá escolhi a cor mas não vi diferença alguma!

Obrigado pelos que tentaram!
avatar

Pika_mestre
Usuário avançado

Masculino
Inscrito dia : 28/06/2011
Mensagens : 362
Pontos Ativos : 580

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

Resolvido Re: Menu com efeito hover

Mensagem por Nicker em 29/06/11, 01:26 pm

Olá,
josedaPM, qual a versão do seu fórum ?
Até mais.
avatar

Nicker
Usuário destaque

Masculino
Inscrito dia : 04/05/2010
Mensagens : 549
Pontos Ativos : 780

Ver perfil do usuário http://www.publieiros.com/

Resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre em 29/06/11, 02:11 pm

@Nicker escreveu:Olá,
josedaPM, qual a versão do seu fórum ?
Até mais.

Meu fórum é da Versão PunBB! Pode me ajudar?
avatar

Pika_mestre
Usuário avançado

Masculino
Inscrito dia : 28/06/2011
Mensagens : 362
Pontos Ativos : 580

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

Resolvido Re: Menu com efeito hover

Mensagem por Nicker em 29/06/11, 02:16 pm

Olá,
Por algum motivo, não sei dizer qual, o hover na versão PunBB, não pega como na versão PhpBB3, neste caso teremos de usar css para personalizar. Poderia nos dizer quais partes do fórum deseja personalizar com o efeito hover ?
Até mais.
avatar

Nicker
Usuário destaque

Masculino
Inscrito dia : 04/05/2010
Mensagens : 549
Pontos Ativos : 780

Ver perfil do usuário http://www.publieiros.com/

Resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre em 29/06/11, 02:26 pm

@Nicker escreveu:Olá,
Por algum motivo, não sei dizer qual, o hover na versão PunBB, não pega como na versão PhpBB3, neste caso teremos de usar css para personalizar. Poderia nos dizer quais partes do fórum deseja personalizar com o efeito hover ?
Até mais.

Cara, nem sei como te agradecer! Obrigado mesmo! Bom, eu queria personalizar as partes que estão nas imagens que eu citei na primeira mensagem deste tópico, só aquela parte mesmo! Explicando melhor, todas as partes do fórum que são daquela forma!
avatar

Pika_mestre
Usuário avançado

Masculino
Inscrito dia : 28/06/2011
Mensagens : 362
Pontos Ativos : 580

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

Resolvido Re: Menu com efeito hover

Mensagem por Nicker em 29/06/11, 02:31 pm

Olá,
Fui ao seu fórum, a imagem que deseja personalizar, no caso seria essa :
http://i28.servimg.com/u/f28/16/38/63/03/seta_p10.jpg
Caso não por favor me mostre com uma imagem.
Até mais.
avatar

Nicker
Usuário destaque

Masculino
Inscrito dia : 04/05/2010
Mensagens : 549
Pontos Ativos : 780

Ver perfil do usuário http://www.publieiros.com/

Resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre em 29/06/11, 02:42 pm

@Nicker escreveu:Olá,
Fui ao seu fórum, a imagem que deseja personalizar, no caso seria essa :
http://i28.servimg.com/u/f28/16/38/63/03/seta_p10.jpg
Caso não por favor me mostre com uma imagem.
Até mais.

Não. É a padrão, volte no meu fórum que agora ela está no lugar certo. (No lugar certo mas a de baixo ainda não funciona).
avatar

Pika_mestre
Usuário avançado

Masculino
Inscrito dia : 28/06/2011
Mensagens : 362
Pontos Ativos : 580

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

Resolvido Re: Menu com efeito hover

Mensagem por Nicker em 29/06/11, 04:43 pm

Olá,
Substitua o código do botão de fim e topo da página, por este :
Código:
<div class ="top"><img src="http://i68.servimg.com/u/f68/14/38/92/90/down-i10.png" onclick="$('html,body').animate({scrollTop: $('#pun-foot').offset().top}, 2000);" title="Fundo da página"></div><div class ="bottom">
<img src="http://i68.servimg.com/u/f68/14/38/92/90/up-ico10.png" onclick="$('html,body').animate({scrollTop: $('#top').offset().top}, 2000);" title="Topo da página"></div>
Agora aceda a gestão : Painel de Controle :seta2: Visualização :seta2:Imagens e cores :seta2: Cores :seta2: Folha de estilo :seta2: e adicione o código abaixo :
Código:
.top{
position: fixed;
top: 0px;
right: 0px;
}
.top:hover{
list-style:none;
overflow:hidden;
background:#F6F4D0; 
margin:2px 2px 2px;
}
.bottom{
position: fixed;
bottom: 0px;
right: 0px;
}
.bottom:hover{
list-style:none;
overflow:hidden;
background:#F6F4D0; 
margin:2px 2px 2px;
}

Depois salve. Eu testei aki, versão PunBB, e funcionou perfeitamente, mais caso apresente problema, ou caso tenha alguma dúvida é só infomar.
Até mais. Muito feliz
avatar

Nicker
Usuário destaque

Masculino
Inscrito dia : 04/05/2010
Mensagens : 549
Pontos Ativos : 780

Ver perfil do usuário http://www.publieiros.com/

Resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre em 30/06/11, 01:18 pm

@Nicker escreveu:Olá,
Substitua o código do botão de fim e topo da página, por este :
Código:
<div class ="top"><img src="http://i68.servimg.com/u/f68/14/38/92/90/down-i10.png" onclick="$('html,body').animate({scrollTop: $('#pun-foot').offset().top}, 2000);" title="Fundo da página"></div><div class ="bottom">
<img src="http://i68.servimg.com/u/f68/14/38/92/90/up-ico10.png" onclick="$('html,body').animate({scrollTop: $('#top').offset().top}, 2000);" title="Topo da página"></div>
Agora aceda a gestão : Painel de Controle :seta2: Visualização :seta2:Imagens e cores :seta2: Cores :seta2: Folha de estilo :seta2: e adicione o código abaixo :
Código:
.top{
position: fixed;
top: 0px;
right: 0px;
}
.top:hover{
list-style:none;
overflow:hidden;
background:#F6F4D0; 
margin:2px 2px 2px;
}
.bottom{
position: fixed;
bottom: 0px;
right: 0px;
}
.bottom:hover{
list-style:none;
overflow:hidden;
background:#F6F4D0; 
margin:2px 2px 2px;
}

Depois salve. Eu testei aki, versão PunBB, e funcionou perfeitamente, mais caso apresente problema, ou caso tenha alguma dúvida é só infomar.
Até mais. Muito feliz

Ainda não deu certo! A única diferença é que quando você bota o mouse fica um fundo laranjado. A seta de cima que leva o fórum pra baixo deu certo como já tinha dado! Mas a debaixo continua com o mesmo problema!

Obrigado aos que tentaram!

@Nicker escreveu:Olá,
Fui ao seu fórum, a imagem que deseja personalizar, no caso seria essa :
http://i28.servimg.com/u/f28/16/38/63/03/seta_p10.jpg
Caso não por favor me mostre com uma imagem.
Até mais.

Mas você tá me ajudando nas setas certo? E porque tá postando no tópico do menu com efeito hover?

Este é o tópico certo:

http://ajuda.forumeiros.com/t42620-duvida-botao-de-fim-e-topo-da-pagina

Mas obrigado pela ajuda!
avatar

Pika_mestre
Usuário avançado

Masculino
Inscrito dia : 28/06/2011
Mensagens : 362
Pontos Ativos : 580

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

Resolvido Re: Menu com efeito hover

Mensagem por Luciano98 em 30/06/11, 01:27 pm

josedaPM escreveu:Ainda não deu certo! A única diferença é que quando você bota o mouse fica um fundo laranjado. A seta de cima que leva o fórum pra baixo deu certo como já tinha dado! Mas a debaixo continua com o mesmo problema!

Obrigado aos que tentaram!
Qual o problema que está acontecendo com a seta de baixo?

Você ainda quer o código de alaranjar o fundo das tabelas onde ficam os fóruns?

Até mais.
Luciano98.
avatar

Luciano98
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 01/09/2010
Mensagens : 7648
Pontos Ativos : 11045

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

Resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre em 30/06/11, 01:38 pm

@Luciano98 escreveu:
josedaPM escreveu:Ainda não deu certo! A única diferença é que quando você bota o mouse fica um fundo laranjado. A seta de cima que leva o fórum pra baixo deu certo como já tinha dado! Mas a debaixo continua com o mesmo problema!

Obrigado aos que tentaram!
Qual o problema que está acontecendo com a seta de baixo?

Você ainda quer o código de alaranjar o fundo das tabelas onde ficam os fóruns?

Até mais.
Luciano98.

Bom! Boa tarde! Quando clicamos na seta de baixo não acontece nada (ela devia subir a barra de rolagem) e a barra de rolagem fica travada por uns 10 segundos!

Eu ainda quero o código de alaranjar o fundo sim!
avatar

Pika_mestre
Usuário avançado

Masculino
Inscrito dia : 28/06/2011
Mensagens : 362
Pontos Ativos : 580

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

Resolvido Re: Menu com efeito hover

Mensagem por Luciano98 em 30/06/11, 03:12 pm

Olá!

Acessei seu fórum e as duas setas estão funcionando perfeitamente, deve ser o seu navegador.

Aqui está como resolver sua outra dúvida (alaranjar tabelas do fórum):
Aceda à "Folha de estilo CSS":
Painel de Controle Seta Visualização Seta Imagens e cores Seta Cores Seta Folha de estilo CSS

Código:
div.main div.main-content table.table tbody.statused tr td:hover{background-color:#000000}

Salve.

PS: Não é possível alaranjar toda a linha da tabela dos fóruns (somente cada quadro da tabela), por causa da versão do seu fórum.

Até mais.
Luciano98


Última edição por Luciano98 em 30/06/11, 03:18 pm, editado 1 vez(es)
avatar

Luciano98
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 01/09/2010
Mensagens : 7648
Pontos Ativos : 11045

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

Resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre em 30/06/11, 03:17 pm

@Luciano98 escreveu:Olá!

Acessei seu fórum e as duas setas estão funcionando perfeitamente, deve ser o seu navegador.

Para o outro problema:
Aceda à "Folha de estilo CSS":
Painel de Controle Seta Visualização Seta Imagens e cores Seta Cores Seta Folha de estilo CSS

Código:
div.main div.main-content table.table tbody.statused tr td:hover{background-color:#000000}

Salve.

PS: Não é possível alaranjar toda a linha da tabela, por causa da versão do seu fórum.

Até mais.
Luciano98

Já que no seu funcionou vamos deixar assim! Sobre a coloração das tabelas:


Meu, não sei nem como te agradecer:



Ficou MASSAAAAAAAAAAAAAAAAAAAAAAAAAA!!!

É só colocar o código hexadecimal da cor que eu quiser?
avatar

Pika_mestre
Usuário avançado

Masculino
Inscrito dia : 28/06/2011
Mensagens : 362
Pontos Ativos : 580

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

Resolvido Re: Menu com efeito hover

Mensagem por Luciano98 em 30/06/11, 03:19 pm

josedaPM escreveu:Já que no seu funcionou vamos deixar assim! Sobre a coloração das tabelas:

Meu, não sei nem como te agradecer:

Ficou MASSAAAAAAAAAAAAAAAAAAAAAAAAAA!!!

É só colocar o código hexadecimal da cor que eu quiser?
Sim, isso mesmo.

Até mais.
Luciano98.
avatar

Luciano98
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 01/09/2010
Mensagens : 7648
Pontos Ativos : 11045

Ver perfil do usuário http://ajuda.forumeiros.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