Mudar estrutura do menu

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

Resolvido Mudar estrutura do menu

Mensagem por Lupina em 03/04/18, 03:46 pm

Detalhes da questão


Endereço do fórum: http://idmrpg.forumeiros.com/
Versão do fórum: phpBB2

Descrição


Boa tarde! Feliz 2

Gostaria de mudar a aparência do meu menu. Atualmente ele encontra-se assim, basicamente o padrão de uma das skins do Hitskin.

Agora eu queria deixá-lo dessa maneira, de modo que não precise me preocupar em fazer imagens para o menu. O efeito roxo é porque o mouse estava sobre aquela parte do menu, aí ele foi acentuado com essa cor. Gostaria de manter isso também, se possível.

Obrigada! Ah, e o exemplo é desse fórum.
avatar

Lupina
Nível 4

Feminino
Inscrito dia : 03/12/2014
Mensagens : 28
Pontos Ativos : 50

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

Resolvido Re: Mudar estrutura do menu

Mensagem por Chanp em 03/04/18, 04:04 pm

Olá,
Aceda à:

Painel de Controle Seta Visualização Seta Imagens e Cores Seta Cores Seta Folha de Estilo CSS

E adicione na sua Folha de Estilo o seguinte código:

Código:
a.mainmenu {
  font-size: 8px;
  font-family: Calibri;
  letter-spacing: 1px;
  padding: 5px;
  text-transform: uppercase;
  font-weight: 400;
}
.mainmenu {
  background-color: rgba(0,0,0,0.5);
  border: 1px solid #fff;
  margin-left: -25px;
  margin-top: 40px;
  position: relative;
  text-align: center;
  width: 1229px;
}

Fica no seu agrado?
o/
avatar

Chanp
Nível 9

Masculino
Inscrito dia : 03/01/2018
Mensagens : 183
Pontos Ativos : 210

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

Resolvido Re: Mudar estrutura do menu

Mensagem por Lupina em 03/04/18, 04:46 pm

Olá, @Chanp!

A princípio, a estrutura funcionou, mas ficou bugado. https://imgur.com/a/3gsKI
avatar

Lupina
Nível 4

Feminino
Inscrito dia : 03/12/2014
Mensagens : 28
Pontos Ativos : 50

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

Resolvido Re: Mudar estrutura do menu

Mensagem por RafaelS. em 03/04/18, 07:59 pm

Olá!

Primeiramente remova todos os códigos aqui passados.

Adicione este código JavaScript com aplicação em todas as páginas:

Código:
 $(document).ready(function(){
$(".mainmenu").parent().css({"background-color": "rgba(0,0,0,0.5)","border": "1px solid #fff","margin-left": "-25px","margin-top": "40px", "position": "relative","text-align": "center","padding":"5px", "width": "101pc"});
});

Se não quiser usar códigos jScript, podemos fazer por templates Piscada

Para o efeito do mouse, adicione este CSS:

Código:
a.mainmenu:hover {
    background: #440091;
    opacity: 1;
    padding: 5px;
    transition: 1s;
}

Até.
avatar

RafaelS.
Hiperativo

Masculino
Inscrito dia : 26/04/2014
Mensagens : 3185
Pontos Ativos : 4132

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

Resolvido Re: Mudar estrutura do menu

Mensagem por Lupina em 05/04/18, 11:07 pm

Olá, @RafaelS..

O código funcionou em sua estrutura, mas queria esclarecer uma duvida; o fato do efeito estar descentralizado se dá porque há poucos links no menu?

https://imgur.com/a/5liH5
avatar

Lupina
Nível 4

Feminino
Inscrito dia : 03/12/2014
Mensagens : 28
Pontos Ativos : 50

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

Resolvido Re: Mudar estrutura do menu

Mensagem por RafaelS. em 06/04/18, 12:53 am

Olá Lupina,

Na verdade é porquê tem uma imagem "invisível" nos menus.
Veja se ao adicionar este código ao CSS, resolve o seu problema:

Código:
a.mainmenu img {
    display: none;
}
a.mainmenu {
    padding: 5px;
}

Até mais. zen
avatar

RafaelS.
Hiperativo

Masculino
Inscrito dia : 26/04/2014
Mensagens : 3185
Pontos Ativos : 4132

Ver perfil do usuário http://techmais.forumeiros.com/
  • 0

Resolvido Re: Mudar estrutura do menu

Mensagem por Lupina em 07/04/18, 05:06 pm

Funcionou perfeitamente, @RafaelS. Muito obrigada! Muito feliz
avatar

Lupina
Nível 4

Feminino
Inscrito dia : 03/12/2014
Mensagens : 28
Pontos Ativos : 50

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

Resolvido Re: Mudar estrutura do menu

Mensagem por virus em 07/04/18, 05:12 pm

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.


Bem-vindo ao Fórum dos Fóruns!
Leia as regras do Fórum dos Fóruns e as regras do setor de suporte.
Antes de criar um tópico, verifique se sua questão já não foi respondida.
Se sua questão foi resolvida, marque-a clicando no botão resolvido para organizar o fórum.
virus — Ajudeiro

avatar

virus
Ajudeiro
Ajudeiro

Masculino
Inscrito dia : 03/03/2013
Mensagens : 644
Pontos Ativos : 851

Ver perfil do usuário http://beta.masterforum.biz/

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo


Permissão deste fórum:
Você não pode responder aos tópicos neste fórum