Isto é uma pré-visualização de um tema em Hitskin.com
Instalar o tema • Voltar para a ficha do tema
Menu personalizado
3 participantes
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Menu personalizado
Qual é minha questão:
Olá, tem como deixar o menu igual do facebook? tipo, que não fica só em baixo do logo ou só em cima mas que vá acompanhando a gente tem como? Se não der para fazer eu gostaria de saber como deixa o menu assim:
https://2img.net/h/oi47.tinypic.com/33uydu9.png
É só isso obrigado pela atenção.
Endereço do meu fórum:
https://ajuda.forumeiros.com
Versão do fórum:
PHPBB3
Olá, tem como deixar o menu igual do facebook? tipo, que não fica só em baixo do logo ou só em cima mas que vá acompanhando a gente tem como? Se não der para fazer eu gostaria de saber como deixa o menu assim:
https://2img.net/h/oi47.tinypic.com/33uydu9.png
É só isso obrigado pela atenção.
Endereço do meu fórum:
https://ajuda.forumeiros.com
Versão do fórum:
PHPBB3
Última edição por HugoJatene em 30.12.12 18:19, editado 1 vez(es)
Re: Menu personalizado
Olá!
Aceda a "Gestão dos Códigos JavaScript":
Título Coloque um título qualquer.
Investimento Em Todas as páginas
Código:
Fazendo isto, agora aceda a "Folha de Estilo CSS":
Até mais!
Aceda a "Gestão dos Códigos JavaScript":
Clique em "Criar um novo JavaScript"Painel de Controle Módulos HTML & JAVASCRIPT Gestão dos Códigos JavaScript
Título Coloque um título qualquer.
Investimento Em Todas as páginas
Código:
- Código:
jQuery(document).ready(function(){if(jQuery('#logout').length){var m="<div id='cssmenu'>
<ul>
<li><a href='http://bramegacity.forumeiros.com/forum'><span>Início</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/'><span>Portal</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/calendar'><span>Calendário </span></a></li>
<li><a href='http://bramegacity.forumeiros.com/gallery/index.htm'><span>Galeria </span></a></li>
<li><a href='http://bramegacity.forumeiros.com/faq'><span>FAQ</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/search'><span>Buscar</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/memberlist'><span>Membros</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/groups'><span>Grupos</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/profile?mode=editprofile'><span>Perfil</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/privmsg?folder=inbox'><span>Mensagens Privadas</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/login?logout=1&tid=57b272618d751c5f94ab8da789d69ec9&key=e1b36e'><span>Sair</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/login'><span>Login</span></a></li>
<li><a href='http://bramegacity.forumeiros.com/register'><span>Registrar-se</span></a></li>
</ul>
</div>"};jQuery('#page-header .navbar').replaceWith(m)});
Fazendo isto, agora aceda a "Folha de Estilo CSS":
Código:Painel de Controle Visualização Imagens e Cores Cores Folha de Estilo CSS
- Código:
#cssmenu ul,
#cssmenu li,
#cssmenu span,
#cssmenu a {
margin: 0;
padding: 0;
position: relative;
}
#cssmenu {
height: 49px;
border-radius: 5px 5px 0 0;
-moz-border-radius: 5px 5px 0 0;
-webkit-border-radius: 5px 5px 0 0;
background: #141414;
background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#32323a', EndColorStr='#141414', GradientType=0);
border-bottom: 2px solid #e00f16;
}
#cssmenu:after,
#cssmenu ul:after {
content: '';
display: block;
clear: both;
}
#cssmenu a {
background: #141414;
background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#32323a', EndColorStr='#141414', GradientType=0);
color: #ffffff;
display: inline-block;
font-family: Helvetica, Arial, Verdana, sans-serif;
font-size: 12px;
line-height: 49px;
padding: 0 20px;
text-decoration: none;
}
#cssmenu ul {
list-style: none;
}
#cssmenu > ul {
float: left;
}
#cssmenu > ul > li {
float: left;
}
#cssmenu > ul > li:hover:after {
content: '';
display: block;
width: 0;
height: 0;
position: absolute;
left: 50%;
bottom: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #e00f16;
margin-left: -10px;
}
#cssmenu > ul > li:first-child > a {
border-radius: 5px 0 0 0;
-moz-border-radius: 5px 0 0 0;
-webkit-border-radius: 5px 0 0 0;
}
#cssmenu > ul > li:last-child > a {
border-radius: 0 5px 0 0;
-moz-border-radius: 0 5px 0 0;
-webkit-border-radius: 0 5px 0 0;
}
#cssmenu > ul > li.active > a {
box-shadow: inset 0 0 3px #000000;
-moz-box-shadow: inset 0 0 3px #000000;
-webkit-box-shadow: inset 0 0 3px #000000;
background: #070707;
background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#26262c', EndColorStr='#070707', GradientType=0);
}
#cssmenu > ul > li:hover > a {
background: #070707;
background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#26262c', EndColorStr='#070707', GradientType=0);
box-shadow: inset 0 0 3px #000000;
-moz-box-shadow: inset 0 0 3px #000000;
-webkit-box-shadow: inset 0 0 3px #000000;
}
#cssmenu .has-sub {
z-index: 1;
}
#cssmenu .has-sub:hover > ul {
display: block;
}
#cssmenu .has-sub ul {
display: none;
position: absolute;
width: 200px;
top: 100%;
left: 0;
}
#cssmenu .has-sub ul li {
*margin-bottom: -1px;
}
#cssmenu .has-sub ul li a {
background: #e00f16;
border-bottom: 1px dotted #ec6f73;
filter: none;
font-size: 11px;
display: block;
line-height: 120%;
padding: 10px;
}
#cssmenu .has-sub ul li:hover a {
background: #b00c11;
}
#cssmenu .has-sub .has-sub:hover > ul {
display: block;
}
#cssmenu .has-sub .has-sub ul {
display: none;
position: absolute;
left: 100%;
top: 0;
}
#cssmenu .has-sub .has-sub ul li a {
background: #b00c11;
border-bottom: 1px dotted #d06d70;
}
#cssmenu .has-sub .has-sub ul li a:hover {
background: #80090d;
}
Até mais!
Re: Menu personalizado
Não funcionou eu fiz como você falou mas não deu :/, aqui a minha folha css:
- Código:
a[href^="/u"] span[style^="color:red"]{background:url(http://i46.servimg.com/u/f46/16/56/73/62/21ee1p10.gif) top left}
li.row{text-align:center !important;}
a[href="/g10-administrador"]{background:url(http://i46.servimg.com/u/f46/16/56/73/62/21ee1p10.gif) no-repeat;text-shadow:0 0 .2em #F50505}
.forumtitle {text-shadow: #16F05B 0px 0px 5px;}
.user a[href*="/u"]{font-weight: bold; font-family: Vivaldi}
.post span.name, .post .poster-profile{text-align:center;width:100%;display:inline-block}
ul.topiclist.forums li.row dl.icon dd.lastpost{-moz-box-shadow:0px 0px 7px #000;
-webkit-box-shadow:0px 0px 7px #000;
box-shadow:0px 0px 7px #000;
border: 1px solid #000;
-moz-border-radius:20px;
-webkit-border-radius:10px;
border-radius:10px;
width:200px !important;
}
.poster-profile img{
margin-left: 3px;
border: 5px solid #eee;
-webkit-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
-moz-box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
box-shadow: 4px 4px 4px rgba(0,0,0,0.2);
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
}
.poster-profile img:hover {
-webkit-transform: rotate(-7deg);
-moz-transform: rotate(-7deg);
-o-transform: rotate(-7deg);
}
.forabg:hover{-moz-box-shadow:1px 1px 5px #9C9C9C; -webkit-box-shadow:1px 1px 10px black; box-shadow:1px 1px 10px black}
a[href="/u316"]{background:url(http://i.imgur.com/ZFoje.gif);font-family:Condiment, cursive;text-shadow:0 0 7px #C40000}
#textarea_content{outline:none;width:77%!important}
#textarea_content textarea#text_editor_textarea{width:98%!important}
#page-header .navbar ul.linklist li {
padding-bottom: 8px;
padding-left: 8px;
padding-right: 8px;
padding-top: 8px;
}
#wrap {
margin-top: 46px;
width: 95%;
}
#search-box {
display: none;
}
#cssmenu ul,
#cssmenu li,
#cssmenu span,
#cssmenu a {
margin: 0;
padding: 0;
position: relative;
}
#cssmenu {
height: 49px;
border-radius: 5px 5px 0 0;
-moz-border-radius: 5px 5px 0 0;
-webkit-border-radius: 5px 5px 0 0;
background: #141414;
background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#32323a', EndColorStr='#141414', GradientType=0);
border-bottom: 2px solid #e00f16;
}
#cssmenu:after,
#cssmenu ul:after {
content: '';
display: block;
clear: both;
}
#cssmenu a {
background: #141414;
background: -moz-linear-gradient(top, #32323a 0%, #141414 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #32323a), color-stop(100%, #141414));
background: -webkit-linear-gradient(top, #32323a 0%, #141414 100%);
background: -o-linear-gradient(top, #32323a 0%, #141414 100%);
background: -ms-linear-gradient(top, #32323a 0%, #141414 100%);
background: linear-gradient(to bottom, #32323a 0%, #141414 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#32323a', EndColorStr='#141414', GradientType=0);
color: #ffffff;
display: inline-block;
font-family: Helvetica, Arial, Verdana, sans-serif;
font-size: 12px;
line-height: 49px;
padding: 0 20px;
text-decoration: none;
}
#cssmenu ul {
list-style: none;
}
#cssmenu > ul {
float: left;
}
#cssmenu > ul > li {
float: left;
}
#cssmenu > ul > li:hover:after {
content: '';
display: block;
width: 0;
height: 0;
position: absolute;
left: 50%;
bottom: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 10px solid #e00f16;
margin-left: -10px;
}
#cssmenu > ul > li:first-child > a {
border-radius: 5px 0 0 0;
-moz-border-radius: 5px 0 0 0;
-webkit-border-radius: 5px 0 0 0;
}
#cssmenu > ul > li:last-child > a {
border-radius: 0 5px 0 0;
-moz-border-radius: 0 5px 0 0;
-webkit-border-radius: 0 5px 0 0;
}
#cssmenu > ul > li.active > a {
box-shadow: inset 0 0 3px #000000;
-moz-box-shadow: inset 0 0 3px #000000;
-webkit-box-shadow: inset 0 0 3px #000000;
background: #070707;
background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#26262c', EndColorStr='#070707', GradientType=0);
}
#cssmenu > ul > li:hover > a {
background: #070707;
background: -moz-linear-gradient(top, #26262c 0%, #070707 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #26262c), color-stop(100%, #070707));
background: -webkit-linear-gradient(top, #26262c 0%, #070707 100%);
background: -o-linear-gradient(top, #26262c 0%, #070707 100%);
background: -ms-linear-gradient(top, #26262c 0%, #070707 100%);
background: linear-gradient(to bottom, #26262c 0%, #070707 100%);
filter: progid:DXImageTransform.Microsoft.Gradient(StartColorStr='#26262c', EndColorStr='#070707', GradientType=0);
box-shadow: inset 0 0 3px #000000;
-moz-box-shadow: inset 0 0 3px #000000;
-webkit-box-shadow: inset 0 0 3px #000000;
}
#cssmenu .has-sub {
z-index: 1;
}
#cssmenu .has-sub:hover > ul {
display: block;
}
#cssmenu .has-sub ul {
display: none;
position: absolute;
width: 200px;
top: 100%;
left: 0;
}
#cssmenu .has-sub ul li {
*margin-bottom: -1px;
}
#cssmenu .has-sub ul li a {
background: #e00f16;
border-bottom: 1px dotted #ec6f73;
filter: none;
font-size: 11px;
display: block;
line-height: 120%;
padding: 10px;
}
#cssmenu .has-sub ul li:hover a {
background: #b00c11;
}
#cssmenu .has-sub .has-sub:hover > ul {
display: block;
}
#cssmenu .has-sub .has-sub ul {
display: none;
position: absolute;
left: 100%;
top: 0;
}
#cssmenu .has-sub .has-sub ul li a {
background: #b00c11;
border-bottom: 1px dotted #d06d70;
}
#cssmenu .has-sub .has-sub ul li a:hover {
background: #80090d;
}
Re: Menu personalizado
Saudações,
Painel de controle ► Visualização ► Cores ► Folha de estilo CSS
Esse código deve ser colado no final de sua Folha de estilo CSS:
Se não funcionar, use esse CSS:
Clique no botão "Salvar".
Assombrosamente.
Painel de controle ► Visualização ► Cores ► Folha de estilo CSS
Esse código deve ser colado no final de sua Folha de estilo CSS:
td.bodyline{padding-top:42px}td.bodyline table[align="center"][border="0"][cellpadding="0"][cellspacing="0"] tbody tr td[align="center"]{position:fixed;top:0px;left:0px;width:100%}
Se não funcionar, use esse CSS:
#wrap{padding-top:42px}#page-header .navbar{position:fixed;top:0px;left:0px;width:100%}
Clique no botão "Salvar".
Assombrosamente.
Holmes- ****
- Membro desde : 11/11/2012
Mensagens : 303
Pontos : 413
Re: Menu personalizado
Qual dos dois CSS você usou?HugoJatene escreveu:Opa, funcionou, mas tem como mudar a cor?
Assombrosamente.
Holmes- ****
- Membro desde : 11/11/2012
Mensagens : 303
Pontos : 413
Re: Menu personalizado
o segundo que você mandou:
- Código:
#wrap{padding-top:42px}#page-header .navbar{position:fixed;top:0px;left:0px;width:100%}
Tópicos semelhantes
» Menu Personalizado
» Menu personalizado
» Menu personalizado
» Menu personalizado
» Menu personalizado
» Menu personalizado
» Menu personalizado
» Menu personalizado
» Menu personalizado
Fórum dos Fóruns :: Ajuda e atendimento ao utilizador :: Questões sobre a aparência do fórum :: Questões resolvidas sobre a aparência do fórum
Página 1 de 1
Permissões neste sub-fórum
Não podes responder a tópicos