Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Acesso rápido

Fóruns de suporte oficiais
Login

Esqueci minha senha

Últimos assuntos
Perdi minha senha!
Você precisa recuperar sua senha?
Clique aqui
Parceiros Forumeiros
Os membros mais ativos da semana
Kyo Panda
 
Shek Crowley
 
Fou-Lu
 
Holkis
 
iScroll
 
Sr.Oliveira
 
while
 
Harleen
 
fiapinho
 
Stewart
 

Quem está conectado
226 usuários online :: 3 usuários cadastrados, Nenhum Invisível e 223 Visitantes :: 2 Motores de busca

Fou-Lu, ranzatti, tabarra

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em Qui 24 Dez 2009 - 15:05

Personalizar menu

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

Resolvido Personalizar menu

Mensagem por Faeel em Seg 16 Mar 2015 - 1:11

Detalhes da dúvida


Versão do fórum : PunBB
Nível de acesso : Fundador
Navegador usado : Mozilla Firefox
Imagem :
Imagem da minha dúvida:

Membros afetados : Todos os membros do fórum
Endereço do fórum : http://teste98.forumeiros.com

Descrição do problema

Olá!

gostaria do efeito da imagem no menu do meu fórum, o efeito esta no site da Forumeiros.

Link de onde vi http://www.forumeiros.com/#tab-1

Até mais!

Faeel
Usuário avançado

Masculino
Inscrito dia : 27/03/2014
Mensagens : 400
Pontos Ativos : 1673

http://ajuda.forumeiros.com

Resolvido Re: Personalizar menu

Mensagem por Reset em Seg 16 Mar 2015 - 1:53

Saudações,

Aceda à sua Folha de Estilo CSS:
Painel de Controle Seta Visualização Seta Imagens e Cores Seta Cores Seta Folha de Estilo CSS
Código:
Código:
a.mainmenu {
-webkit-transform: translateZ(0);
-webkit-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out;
border-bottom: 0px solid rgba(255, 255, 255, 0.6);
padding-bottom: 10px;
margin-top: 0;
color: white;
}

Coloque no inicio de teu CSS.

Até mais.

Reset
Membro do Fórum

Masculino
Inscrito dia : 30/09/2014
Mensagens : 1089
Pontos Ativos : 2319

http://ajuda.forumeiros.com/

Resolvido Re: Personalizar menu

Mensagem por Faeel em Seg 16 Mar 2015 - 21:34

Olá!

ficou legal, quero mais uma alteração, que a barra vermelha do hover aparecesse na parte de baixo do menu.
http://prntscr.com/6ho1ve
Até mais!

Faeel
Usuário avançado

Masculino
Inscrito dia : 27/03/2014
Mensagens : 400
Pontos Ativos : 1673

http://ajuda.forumeiros.com

Resolvido Re: Personalizar menu

Mensagem por Hancki em Seg 16 Mar 2015 - 21:58

Olá!

Adicione mais este CSS:
Código:
#pun-navlinks a:hover {
      border-top: 0px!important;
      border-bottom: 3px solid red !important;
}
#pun-navlinks {
    padding-bottom: 10px !important;
}
Resultado: http://prntscr.com/6hofzd

Hancki

Hancki
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8037
Pontos Ativos : 14708

http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://twitter.com/https://www.facebook.com/djtomoficial

Resolvido Re: Personalizar menu

Mensagem por Faeel em Seg 16 Mar 2015 - 22:20

Olá!

o senhor poderia deixar tipo a imagem? alargar o hover um pouco (pouca coisa) e deixar a barra vermelha daquele tipo da imagem abaixo, e na parte marcada em amarelo deixar por completo em cima o hover.
Imagem: http://prntscr.com/6hor49
Espero que entenda.... Até mais!

Faeel
Usuário avançado

Masculino
Inscrito dia : 27/03/2014
Mensagens : 400
Pontos Ativos : 1673

http://ajuda.forumeiros.com

Resolvido Re: Personalizar menu

Mensagem por Hancki em Seg 16 Mar 2015 - 22:21

Então use apenas este trecho do código que já tinha dado:
Código:
#pun-navlinks a:hover {
      border-top: 0px!important;
      border-bottom: 3px solid red !important;
}

Hancki

Hancki
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8037
Pontos Ativos : 14708

http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://twitter.com/https://www.facebook.com/djtomoficial

Resolvido Re: Personalizar menu

Mensagem por Faeel em Seg 16 Mar 2015 - 22:27

Olá!

a parte do hover marcada por amarelo quero que fique por inteira.

Até mais!

Faeel
Usuário avançado

Masculino
Inscrito dia : 27/03/2014
Mensagens : 400
Pontos Ativos : 1673

http://ajuda.forumeiros.com

Resolvido Re: Personalizar menu

Mensagem por Hancki em Seg 16 Mar 2015 - 22:35

Agora entendi Feliz

Use mais este:
Código:
#pun-navlinks a {
        padding-top: 18px !important;
}
Resultado: http://prntscr.com/6hoyx9

Hancki

Hancki
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8037
Pontos Ativos : 14708

http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://twitter.com/https://www.facebook.com/djtomoficial

Resolvido Re: Personalizar menu

Mensagem por Faeel em Seg 16 Mar 2015 - 22:38

Olá!


Sim ficou perfeito, mas meio estranho ficou meu menu, poderia adicionar figamos uma pequena linha no meio dos menus ali? ex: http://prntscr.com/6hp075
Ah, e destacar um pouco mais a letra, tipo Assim
Até mais!

Faeel
Usuário avançado

Masculino
Inscrito dia : 27/03/2014
Mensagens : 400
Pontos Ativos : 1673

http://ajuda.forumeiros.com

Resolvido Re: Personalizar menu

Mensagem por Hancki em Seg 16 Mar 2015 - 23:08

Com mais este código fica bem bonito até!
Código:
#pun-navlinks a {
        font-weight: bold;
        margin-left: 20px !important;
}
#pun-navlinks li {
        border-right: 1px solid white;
        padding-bottom: 8px !important;
}
Resultado: http://prntscr.com/6hpeg8

Hancki

Hancki
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8037
Pontos Ativos : 14708

http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://twitter.com/https://www.facebook.com/djtomoficial

Resolvido Re: Personalizar menu

Mensagem por Faeel em Seg 16 Mar 2015 - 23:16

Olá!

aqui não ficou muito perfeito, o menu ficou mais para a esquerda das barras, teria como deixar ele centralizado nas barras, e o hover inteiro?

Faeel
Usuário avançado

Masculino
Inscrito dia : 27/03/2014
Mensagens : 400
Pontos Ativos : 1673

http://ajuda.forumeiros.com

Resolvido Re: Personalizar menu

Mensagem por Hancki em Seg 16 Mar 2015 - 23:16

Pode mostrar por print como deseja? É mais fácil!

Hancki
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8037
Pontos Ativos : 14708

http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://twitter.com/https://www.facebook.com/djtomoficial

Resolvido Re: Personalizar menu

Mensagem por Faeel em Seg 16 Mar 2015 - 23:23

Assim: http://prntscr.com/6hpkcl
o hover do menu por inteiro como na imagem acima, e o texto dos menus centralizado no seu local.

Faeel
Usuário avançado

Masculino
Inscrito dia : 27/03/2014
Mensagens : 400
Pontos Ativos : 1673

http://ajuda.forumeiros.com

Resolvido Re: Personalizar menu

Mensagem por Hancki em Ter 17 Mar 2015 - 0:33

Não consegui fazer com que o fundo ficasse totalmente preenchido até à borda... mas consegui centrar!

Código:
#pun-navlinks li a.mainmenu {
        margin-left: 20px !important;
}

Resultado:


Hancki

Hancki
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8037
Pontos Ativos : 14708

http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://twitter.com/https://www.facebook.com/djtomoficial

Resolvido Re: Personalizar menu

Mensagem por Faeel em Ter 17 Mar 2015 - 0:57

Utilizei um código para retirar alguns menus, e deu erro, pode arrumar? http://prntscr.com/6hqk8n

Faeel
Usuário avançado

Masculino
Inscrito dia : 27/03/2014
Mensagens : 400
Pontos Ativos : 1673

http://ajuda.forumeiros.com

Resolvido Re: Personalizar menu

Mensagem por Sennior em Ter 17 Mar 2015 - 6:51

Saudações! Muito feliz

Adicione o código abaixo no INICIO de teu CSS, creio que terá que retirar o outro que esta com a função hover:
Vá em:
Painel de controle  Seta curta Visualização  Seta curta Cores Seta curta "Aba" Folha CSS.

Adicione no conteúdo:
Código:
#pun-navlinks li:hover {border-bottom: 3px solid #1582C6!important;background: #525151!important;padding-bottom: 19px!important;padding-top: 13px!important;position: relative!important;
}

Salve e Visualize seu fórum. Piscada
Melhores cumprimentos,
Sennior. De bem com a vida

Sennior
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16258
Pontos Ativos : 22837

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Personalizar menu

Mensagem por Faeel em Ter 17 Mar 2015 - 22:33

Quando eu passo o mouse ele não apresenta o hover, mas quando eu clico no hover ele aparece deste modo, http://prntscr.com/6i3fo3

Faeel
Usuário avançado

Masculino
Inscrito dia : 27/03/2014
Mensagens : 400
Pontos Ativos : 1673

http://ajuda.forumeiros.com

Resolvido Re: Personalizar menu

Mensagem por Hancki em Ter 17 Mar 2015 - 22:52

Olá!

Vi que parece corrigido: http://prntscr.com/6i3ook
Já não quer mais nenhuma modificação?

Hancki

Hancki
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8037
Pontos Ativos : 14708

http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://twitter.com/https://www.facebook.com/djtomoficial

Resolvido Re: Personalizar menu

Mensagem por Faeel em Ter 17 Mar 2015 - 22:59

Não amigo, nada resolvido, veja aqui o mouse esta fora do link lá http://prntscr.com/6i3r1w e aqui ele esta em cima, eu gostaria que ele ficasse todo como esta imagem http://prntscr.com/6i3r5e.

Espero que entenda... é meio confuso mesmo..

Até!

Faeel
Usuário avançado

Masculino
Inscrito dia : 27/03/2014
Mensagens : 400
Pontos Ativos : 1673

http://ajuda.forumeiros.com

Resolvido Re: Personalizar menu

Mensagem por Hancki em Ter 17 Mar 2015 - 23:08

Será assim: http://prntscr.com/6i3vxc ?
Se sim, remova o código dado acima pelo Sennior e coloque este:
Código:
#pun-navlinks li a.mainmenu {
  border: 0px !important;
  background: none !important;
}
#pun-navlinks li:hover {
  cursor:pointer;
  border-left: 1px solid white;
  margin-left: -1px !important;
  background: #525151!important;
  border-bottom: 3px solid red!important;
  padding-bottom: 19px!important;
  padding-top: 13px!important;
  position: relative!important;
}

É isso?

Hancki

Hancki
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 03/10/2009
Mensagens : 8037
Pontos Ativos : 14708

http://programacaoweb.forumeiros.com/ https://www.facebook.com/djtomoficial https://twitter.com/https://www.facebook.com/djtomoficial

Resolvido Re: Personalizar menu

Mensagem por Sennior em Qui 19 Mar 2015 - 6:13

Ou então... Envergonhado Pode ir no seu CSSe tirar este código e tentar com o meu... Feliz
Código:
#pun-navlinks a:hover {
  background: none repeat scroll 0 0 #4D4D4D;
  border-bottom: 3px solid red!important;
  border-top: 0!important;
  color: #fff!important;
  padding-bottom: 11px!important;
}

Até mais.

Sennior
Ex-Admineiro
Ex-Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16258
Pontos Ativos : 22837

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Personalizar menu

Mensagem por Faeel em Qui 19 Mar 2015 - 21:43

não é oque quero...

Faeel
Usuário avançado

Masculino
Inscrito dia : 27/03/2014
Mensagens : 400
Pontos Ativos : 1673

http://ajuda.forumeiros.com

Resolvido Re: Personalizar menu

Mensagem por Gaaratsu em Sab 28 Mar 2015 - 16:23

Segundo o regulamento do setor de suporte, tópicos com mais de 7 dias devem ser arquivados por abandono do próprio autor. Você poderá obter mais informações lendo este tópico:
Regras para a postagem de dúvidas

Caso ainda tenha dúvidas, aconselhamos que crie um novo tópico no setor de suporte, tendo em vista que este não deve ficar na seção por mais de 7 dias.

Gaaratsu
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 07/08/2010
Mensagens : 5541
Pontos Ativos : 9331

http://narutongo.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