Boas-vindas ao Power Pixel

Junte-se a comunidade! Crie o seu próprio conteúdo, e faça amizades.EntrarCriar uma conta

Efeito de Menu de Navegação e caixa de Buscar e Redes Sociais

3 participantes

Início :: Forumeiros :: NostalgiaEfeito de Menu de Navegação e caixa de Buscar e Redes Sociais

avatar IsmaelS.  • Qua 7 Ago 2013 - 10:36

Efeito de Menu de Navegação e caixa de Buscar e Redes Sociais Empty Efeito de Menu de Navegação e caixa de Buscar e Redes Sociais Qua 7 Ago 2013 - 10:36

Qual é minha questão:
Olá,

Gostava de colocar o Menu de Navegação e a caixa que aparece em baixo das Redes Sociais e da Caixa de Busca, desta print:

[Tens de ter uma conta e sessão iniciada para poderes visualizar esta imagem]

Fórum que vi o efeito foi: http://starforums.forumeiros.com/

Endereço do meu fórum:
fórum de teste

Versão:
PunBB

[Dark]Doki-. [Dark]Doki-.  • Qua 7 Ago 2013 - 14:53

Efeito de Menu de Navegação e caixa de Buscar e Redes Sociais Empty Re: Efeito de Menu de Navegação e caixa de Buscar e Redes Sociais Qua 7 Ago 2013 - 14:53

Reputação da mensagem: 100% (1 votos)
Codigo da barra:
Código:
<div id="userbar"><div id="quicknav"><ul><li><a class="social_icon facebook" href="#" title="Facebook" target="_blank"></a></li><li><a class="social_icon twitter" href="#" title="Twitter" target="_blank"></a></li><li><a class="social_icon googleplus" href="#" title="Google+" target="_blank"></a></li><li><a class="social_icon rss" href="#" title="RSS" target="_blank"></a></li><li class="first"><a href="/forum">STAR FÓRUMS</a></li><li><a href="http://www.forumeiros.com/pt/informatica-e-internet/diversos-35.htm"> COPYRIGHT © 2012 - 2013</a></li></ul></div><div id="search"><form action="/search?search_where=11" method="get" id="search-form"><input type="text" name="search_keywords" id="keywords" maxlength="128" class="inputbox search" placeholder="Buscar..."><input class="search-button" id="seach-b" type="submit" name="submit" value=""></form></div></div>

Css:
Código:



#userbar {
background: #fafafa;
border-bottom: 1px solid #ddd;
clear: both;
font-family: Oxygen, sans-serif;
height: 56px;
padding: 0 10px;
text-transform: uppercase;
}
#quicknav {
float: left;
margin-top: 12px;
}
#quicknav li, #quicknav ul {
float: left;
list-style: none;
margin: 0;
padding: 0;
}
ul, menu, dir {
display: block;
list-style-type: disc;
-webkit-margin-before: 1em;
-webkit-margin-after: 1em;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 40px;
}
li {
display: list-item;
text-align: -webkit-match-parent;
}
#quicknav .social_icon {
background: url(http://demo.dzinerstudio.com/smf2/Themes/vivanto_20/images/custom/social-icons.png) no-repeat;
height: 36px;
padding: 0;
width: 36px;
}
#quicknav .facebook {
background-position: 0 0;
}
#quicknav a {
color: #444;
display: block;
line-height: 36px;
padding-left: 15px;
}
#quicknav .twitter {
background-position: 0 -78px;
}
#quicknav .googleplus {
background-position: 0 -156px;
}
#quicknav .rss {
background-position: 0 -468px;
}
#search {
float: right;
margin-top: 13px;
}
#search input {
float: left;
}
#keywords {
background: #fff;
border: 1px solid #e3e3e3;
border-radius: 0;
color: #888;
height: 20px;
line-height: 1;
margin-right: -145px;
outline: none;
padding: 6px 8px;
width: 250px;
}
#search input.search-button {
background: url(http://demo.dzinerstudio.com/smf2/Themes/vivanto_20/images/custom/search-button.png) 0 0 no-repeat!important;
border: none!important;
border-color: transparent!important;
box-shadow: none;
cursor: pointer;
float: right;
height: 35px!important;
margin-right: 0;
position: relative;
width: 46px!important;
}
#quicknav .twitter:hover {
background-position: 0 -117px;
}
#quicknav .googleplus:hover {
background-position: 0 -195px;
}
#quicknav .facebook:hover{background-position:0 -39px}
#quicknav .rss:hover {
background-position: 0 -507px;
}


Última edição por [Dark]Doki-. em Qua 7 Ago 2013 - 15:14, editado 1 vez(es)

avatar IsmaelS.  • Qua 7 Ago 2013 - 15:01

avatar IsmaelS.  • Qua 7 Ago 2013 - 15:18

avatar IsmaelS.  • Qua 7 Ago 2013 - 17:10

Daemon Daemon  • Qua 7 Ago 2013 - 17:28

Efeito de Menu de Navegação e caixa de Buscar e Redes Sociais Empty Re: Efeito de Menu de Navegação e caixa de Buscar e Redes Sociais Qua 7 Ago 2013 - 17:28

Master Publicitário pare de fazer flood no tópico, peço que aguarde e tenha paciência.
Até mais!

avatar IsmaelS.  • Qua 7 Ago 2013 - 17:31

avatar IsmaelS.  • Qui 8 Ago 2013 - 20:33

Daemon Daemon  • Qui 8 Ago 2013 - 21:00

Efeito de Menu de Navegação e caixa de Buscar e Redes Sociais Empty Re: Efeito de Menu de Navegação e caixa de Buscar e Redes Sociais Qui 8 Ago 2013 - 21:00

[sucesso=Tópico Resolvido; e Bloqueado][/sucesso]Movido para: Arquivo - Pedido de código

Conteúdo patrocinado  • 

Efeito de Menu de Navegação e caixa de Buscar e Redes Sociais Empty Re: Efeito de Menu de Navegação e caixa de Buscar e Redes Sociais

Início :: Forumeiros :: Nostalgia:: Efeito de Menu de Navegação e caixa de Buscar e Redes Sociais
Permissões neste sub-fórum
Não podes responder a tópicos