Menu com efeito hover

5 participantes

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

Tópico resolvido Menu com efeito hover

Mensagem por Pika_mestre 28.06.11 20:37

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:

https://i.servimg.com/u/f48/16/38/63/03/sem_ef10.jpg

Com o mouse apontando para o quadro ele fica assim:

https://i.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 19:20, editado 1 vez(es)
Pika_mestre

Pika_mestre
Membro avançado

Masculino
Membro desde : 28/06/2011
Mensagens : 362
Pontos : 580

http://pokemestre.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Convidad 28.06.11 20:47

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

O meu fórum é phpBB3
Anonymous

Convidad
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Nicker 28.06.11 21:36

Olá,
Isto é mais conhecido, como campo houver. Para modificar está área basta aceder ao : Painel de controle Seta Visualização Seta Menu com efeito hover Images_couleursImagens 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.
Nicker

Nicker
Membro destaque

Masculino
Membro desde : 04/05/2010
Mensagens : 549
Pontos : 780

http://www.publieiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Convidad 28.06.11 21:41

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

Convidad
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por burlador 28.06.11 22:33

se conseguir arranjar o css dessa parte acho que consigo fazer
avatar

burlador
Nível 9

Masculino
Membro desde : 25/01/2010
Mensagens : 200
Pontos : 290

http://google.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Otaviodg 28.06.11 23:06

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

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

Otaviodg
Membro do fórum

Masculino
Membro desde : 12/06/2011
Mensagens : 1295
Pontos : 1738

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Convidad 29.06.11 15:22

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

Convidad
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre 29.06.11 17:18

Nicker escreveu:Olá,
Isto é mais conhecido, como campo houver. Para modificar está área basta aceder ao : Painel de controle Seta Visualização Seta Menu com efeito hover Images_couleursImagens 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!
Pika_mestre

Pika_mestre
Membro avançado

Masculino
Membro desde : 28/06/2011
Mensagens : 362
Pontos : 580

http://pokemestre.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Nicker 29.06.11 17:26

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

Nicker
Membro destaque

Masculino
Membro desde : 04/05/2010
Mensagens : 549
Pontos : 780

http://www.publieiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre 29.06.11 18:11

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

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

Pika_mestre
Membro avançado

Masculino
Membro desde : 28/06/2011
Mensagens : 362
Pontos : 580

http://pokemestre.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Nicker 29.06.11 18:16

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.
Nicker

Nicker
Membro destaque

Masculino
Membro desde : 04/05/2010
Mensagens : 549
Pontos : 780

http://www.publieiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre 29.06.11 18:26

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!
Pika_mestre

Pika_mestre
Membro avançado

Masculino
Membro desde : 28/06/2011
Mensagens : 362
Pontos : 580

http://pokemestre.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Nicker 29.06.11 18:31

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

Nicker
Membro destaque

Masculino
Membro desde : 04/05/2010
Mensagens : 549
Pontos : 780

http://www.publieiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre 29.06.11 18:42

Nicker escreveu:Olá,
Fui ao seu fórum, a imagem que deseja personalizar, no caso seria essa :
https://i.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).
Pika_mestre

Pika_mestre
Membro avançado

Masculino
Membro desde : 28/06/2011
Mensagens : 362
Pontos : 580

http://pokemestre.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Nicker 29.06.11 20:43

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:Menu com efeito hover Images_couleursImagens 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
Nicker

Nicker
Membro destaque

Masculino
Membro desde : 04/05/2010
Mensagens : 549
Pontos : 780

http://www.publieiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre 30.06.11 17:18

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:Menu com efeito hover Images_couleursImagens 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 :
https://i.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:

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

Mas obrigado pela ajuda!
Pika_mestre

Pika_mestre
Membro avançado

Masculino
Membro desde : 28/06/2011
Mensagens : 362
Pontos : 580

http://pokemestre.forumeiros.com

Ir para o topo Ir para baixo

Principal contribuidor

Tópico resolvido Re: Menu com efeito hover

Mensagem por Luciano98 30.06.11 17:27

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.
Luciano98

Luciano98
Principal contribuidor
Principal contribuidor

Masculino
Membro desde : 02/09/2010
Mensagens : 7647
Pontos : 11049

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre 30.06.11 17:38

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!
Pika_mestre

Pika_mestre
Membro avançado

Masculino
Membro desde : 28/06/2011
Mensagens : 362
Pontos : 580

http://pokemestre.forumeiros.com

Ir para o topo Ir para baixo

Principal contribuidor

Tópico resolvido Re: Menu com efeito hover

Mensagem por Luciano98 30.06.11 19:12

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 19:18, editado 1 vez(es)
Luciano98

Luciano98
Principal contribuidor
Principal contribuidor

Masculino
Membro desde : 02/09/2010
Mensagens : 7647
Pontos : 11049

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Menu com efeito hover

Mensagem por Pika_mestre 30.06.11 19:17

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?
Pika_mestre

Pika_mestre
Membro avançado

Masculino
Membro desde : 28/06/2011
Mensagens : 362
Pontos : 580

http://pokemestre.forumeiros.com

Ir para o topo Ir para baixo

Principal contribuidor

Tópico resolvido Re: Menu com efeito hover

Mensagem por Luciano98 30.06.11 19:19

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.
Luciano98

Luciano98
Principal contribuidor
Principal contribuidor

Masculino
Membro desde : 02/09/2010
Mensagens : 7647
Pontos : 11049

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Ver o tópico anterior Ver o tópico seguinte Ir para o topo

- Tópicos semelhantes

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