Como fazer isso no meu menu

4 participantes

Ir para baixo

Tópico resolvido Como fazer isso no meu menu

Mensagem por viniciusmtn 16.10.12 1:21

Qual é minha questão:
Quando o mause não ta encima do menu https://2img.net/h/s6.tinypic.com/n391yg_th.jpg
ai quando eu passo o mause encima fica assim oh https://2img.net/h/s6.tinypic.com/ipz7f8_th.jpg

Links e imagens do meu problema:
O forum onde eu ve isso foi http://suportedesign.forumeiros.com/

Endereço do meu fórum:
http://forumxbox360.forumais.com/forum

Versão do meu fórum:
PHPBB3


Última edição por viniciusmtn em 16.10.12 23:21, editado 2 vez(es)
viniciusmtn
viniciusmtn
Membro

Membro desde : 04/10/2010
Mensagens : 727
Pontos : 1102

http://www.forumxo.com.br

Ir para o topo Ir para baixo

Tópico resolvido Re: Como fazer isso no meu menu

Mensagem por Ace 16.10.12 1:26

Olá,

Tente o seguintes CSS:

Código:
 #page-header .navbar ul.linklist li{background:url(http://i.imgur.com/indNh.png) bottom;padding:6px 3px 6px 9px}#page-header .navbar ul.linklist li:hover{background:url(http://i.imgur.com/jaLTx.png)}#page-header .navbar{background:url(http://i.imgur.com/indNh.png) bottom;border:1px solid #1293ba;margin-top:-10px}#page-header .navbar ul.linklist li a{color:#fff;font-size:12px;text-shadow:.1em 0 .2em #555}#page-header input.button2{background:#e6b406 url(http://i66.servimg.com/u/f66/11/66/91/15/bg_btn10.png) repeat-x top;color:#4b3b04;font-family:Verdana,Arial,Helvetica,sans-serif;font-size:14px;font-weight:700;padding:5px;width:auto!important} .linklist.navlinks a:hover{-moz-transition:all .2s linear;-o-transition:all .2s linear;-webkit-transition:all .2s linear;background:url(http://i42.servimg.com/u/f42/17/32/13/00/menu-s14.png) no-repeat 50% -2px;padding:5px;position:relative;transition:all .2s linear}

Se entendi bem, o que solicita é:

Código:
 .linklist.navlinks a:hover{-moz-transition:all .2s linear;-o-transition:all .2s linear;-webkit-transition:all .2s linear;background:url(http://i42.servimg.com/u/f42/17/32/13/00/menu-s14.png) no-repeat 50% -2px;padding:5px;position:relative;transition:all .2s linear}

Até Mais!
Ace
Ace
Membro Entusiasta

Membro desde : 06/07/2011
Mensagens : 8881
Pontos : 11608

https://ajuda.forumeiros.com

Ir para o topo Ir para baixo

Tópico resolvido Re: Como fazer isso no meu menu

Mensagem por viniciusmtn 16.10.12 1:30

então entre no meu forum e olhe como fico queria deixa igual ao do forum que eu coloquei encima
viniciusmtn
viniciusmtn
Membro

Membro desde : 04/10/2010
Mensagens : 727
Pontos : 1102

http://www.forumxo.com.br

Ir para o topo Ir para baixo

Tópico resolvido Re: Como fazer isso no meu menu

Mensagem por Convidado 16.10.12 1:32

Boas,
adicione em sua folha de estilo css:
Código:
#page-header .navbar ul.linklist {
    border-bottom: 0px;
    }
    #page-header .navbar span.corners-top, #page-header .navbar span.corners-top span, #page-header .navbar span.corners-bottom, #page-header .navbar span.corners-bottom span {
    display: none;
    }

    #page-header .headerbar span.corners-top, #page-header .headerbar span.corners-top span, #page-header .headerbar span.corners-bottom, #page-header .headerbar span.corners-bottom span {
    background-image: none;
    }
#page-header .navbar ul.navlinks{
background-color: transparent;
}
/*seta no menu ao passar o mouse*/
a.mainmenu{
-moz-transition: all .2s linear;
-o-transition: all .2s linear;
-webkit-transition: all .2s linear;
background: url(http://i42.servimg.com/u/f42/17/32/13/00/menu-s14.png) no-repeat 40% -10px;
padding-top: 14px;
position: relative;
transition: all .2s linear;
}
a.mainmenu:hover {
background: url(http://i42.servimg.com/u/f42/17/32/13/00/menu-s14.png) 50% 0% no-repeat;
padding-top: 6px;
}
Resultou?
Anonymous
Convidado
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Como fazer isso no meu menu

Mensagem por Tiaguu 16.10.12 1:36

Olá para ajeitar aquele erro você precisa do código certo do menu sem o efeito e depois com o efeito.

Eu sei porque eu usava esse menu.


Até amigo.
avatar
Tiaguu
Membro

Membro desde : 28/08/2011
Mensagens : 658
Pontos : 1001

http://wscgames.forumeiros.com/

Ir para o topo Ir para baixo

Tópico resolvido Re: Como fazer isso no meu menu

Mensagem por viniciusmtn 16.10.12 1:40

então foi a seta agora eu queroa essa barra aqui oh https://i.servimg.com/u/f44/15/64/80/11/br_bar10.png no menu junto com a seta e junto ao logo igual o forum a cima
viniciusmtn
viniciusmtn
Membro

Membro desde : 04/10/2010
Mensagens : 727
Pontos : 1102

http://www.forumxo.com.br

Ir para o topo Ir para baixo

Tópico resolvido Re: Como fazer isso no meu menu

Mensagem por Convidado 16.10.12 1:48

Boas,
troque por este amigo:
Código:
/*menu mas atualizado*/
#page-header .navbar ul.linklist {
    border-bottom: 0px;
    }
    #page-header .navbar span.corners-top, #page-header .navbar span.corners-top span, #page-header .navbar span.corners-bottom, #page-header .navbar span.corners-bottom span {
    display: none;
    }

    #page-header .headerbar span.corners-top, #page-header .headerbar span.corners-top span, #page-header .headerbar span.corners-bottom, #page-header .headerbar span.corners-bottom span {
    background-image: none;
    }

    #page-header .navbar ul.linklist li{
    padding: 6px 3px 6px 5;
    background: url(http://i44.servimg.com/u/f44/15/64/80/11/br_bar10.png) bottom;
    }

    #page-header .navbar ul.linklist li:hover{
    background: url(http://i44.servimg.com/u/f44/15/64/80/11/br_bar10.png);
    }

    #page-header .navbar {
    border: 1px solid #2C5787;
    background: url(http://i44.servimg.com/u/f44/15/64/80/11/br_bar10.png) bottom;
    }

    #page-header .navbar ul.linklist li a{
    color: #fff;
    font-size: 12px;
    text-shadow: 0.1em 0em 0.2em #555;
    }

    #page-header input.button2 {
    width: auto !important;
    padding: 20px 20px;
    font-size: 14px;
    font-weight: bold;
    font-family: Verdana,Arial,Helvetica,sans-serif;
    color: #4b3b04;
    background: #e6b406 url('http://i44.servimg.com/u/f44/15/64/80/11/br_bar10.png') repeat-x top;
    }
#page-header .navbar ul.navlinks{
background-color: transparent;
}
Anonymous
Convidado
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Como fazer isso no meu menu

Mensagem por viniciusmtn 16.10.12 2:16

fico ruim olha la no meu forum como fico
viniciusmtn
viniciusmtn
Membro

Membro desde : 04/10/2010
Mensagens : 727
Pontos : 1102

http://www.forumxo.com.br

Ir para o topo Ir para baixo

Tópico resolvido Re: Como fazer isso no meu menu

Mensagem por Convidado 16.10.12 2:26

Boas,
amigo tente tirar a caixa de busca e outra, centralize o menu!
Anonymous
Convidado
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Como fazer isso no meu menu

Mensagem por viniciusmtn 16.10.12 2:37

então amis fico repetindo a imagem queria que ficase so uma barra em verde
viniciusmtn
viniciusmtn
Membro

Membro desde : 04/10/2010
Mensagens : 727
Pontos : 1102

http://www.forumxo.com.br

Ir para o topo Ir para baixo

Tópico resolvido Re: Como fazer isso no meu menu

Mensagem por Convidado 16.10.12 2:39

Boas,
adicione este código em sua folha de estilo depois do código passado para o efeito no menu:
Código:
p.nomargin {
font-size: 1.1em;
line-height: 1.3em;
margin-bottom: 0;
display: none !important;
}
Anonymous
Convidado
Convidado


Ir para o topo Ir para baixo

Tópico resolvido Re: Como fazer isso no meu menu

Mensagem por viniciusmtn 16.10.12 2:45

pronto cara agora so falta o efeito cara com a setinha
viniciusmtn
viniciusmtn
Membro

Membro desde : 04/10/2010
Mensagens : 727
Pontos : 1102

http://www.forumxo.com.br

Ir para o topo Ir para baixo

Tópico resolvido Re: Como fazer isso no meu menu

Mensagem por Sennior 16.10.12 15:14

Olá,

Qual efeito falta agora? Não compreendi, para o mais adicione em teu CSS:

Código:
 a.mainmenu:hover{-moz-transition:all .2s linear;-o-transition:all .2s linear;-webkit-transition:all .2s linear;background:url(http://i42.servimg.com/u/f42/17/32/13/00/menu-s14.png) no-repeat 50% -2px;padding:5px;position:relative;transition:all .2s linear}

Até mais. Piscada
Sennior
Sennior
Principal Contribuidor
Principal Contribuidor

Membro desde : 10/06/2011
Mensagens : 16379
Pontos : 20903

https://ajuda.forumeiros.com/forum https://www.facebook.com/GladstonHenriq https://twitter.com/UmGladston

Ir para o topo Ir para baixo

Ir para o topo

- Tópicos semelhantes

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