Css menu maker

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

Resolvido Css menu maker

Mensagem por r. Felp em 03/03/13, 09:28 pm

Qual é minha questão:
Bom eu fiz 2 menus mas não sei instalar.

Ai vai os códigos.


Css do meu fórum:

Código:
body#phpbb {
padding-top: 60px;
}








.forabg span.corners-top, #page-header .corners-top, #page-header .corners-bottom, #page-footer .corners-top, #page-footer .corners-bottom {
display: none;
}




#wrap {
padding: 0;
  -moz-box-shadow: 0px 0px 3px #c5c7c7;
-webkit-box-shadow: 0px 0px 3px #c5c7c7;
box-shadow: 0px 0px 3px #c5c7c7;
}
.headerbar {
background: #1F1F1F url(http://i46.servimg.com/u/f46/17/46/69/50/header10.png) repeat-x top left;
margin-top: 0;
position: relative;
z-index: 100;
-moz-box-shadow: 0 -2px 3px #cacaca;
-webkit-box-shadow: 0 -2px 3px #cacaca;
box-shadow: 0 -2px 3px #cacaca;
  margin-bottom: 0;




}
#logo-desc {
text-align: left;
}
#page-header .navbar {
position: relative;
height: 86px;
background: none repeat-x left bottom;
margin: 0px 0px 0px 0px;
color: white;
font: bold 11px 'Droid Sans',Arial, Calibri, Verdana, Geneva, sans-serif;
border: 0px solid white;
-moz-border-radius-bottomleft: 3px;
-moz-border-radius-bottomright: 3px;
-webkit-border-bottom-left-radius: 3px;
-webkit-border-bottom-right-radius: 3px;
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
background: url('http://i46.servimg.com/u/f46/17/46/69/50/nav10.png') repeat-x;
}
/*---navbar---*/








#page-body {
padding: 10px 20px 10px 20px;
background: #FFF;
width: 918px;
}




#search-box {
margin-top: 55px;
right: 1px;
position: absolute;
}
#search-box #keywords {
background: white;
border: 1px solid #E7E7E7;
-moz-box-shadow: inset 0px 0px 4px #f4f4f4;
-webkit-box-shadow: inset 0px 0px 4px #f4f4f4;
box-shadow: inset 0px 0px 4px #f4f4f4;
padding: 8px!important;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
font-size: 11px;
vertical-align: middle;
padding: 1px;
border: 1px solid #E7E7E7;
  width: 130px;
}




#search-box .button2 {
background: url('http://i46.servimg.com/u/f46/17/46/69/50/search10.png') no-repeat;
color: transparent;
height: 25px;
width: 25px !important;
border: none;
box-shadow: none !important;
margin: 0 40px 0 10px;
 
}
#search_menu {
left: 500px !important;
top: 40px !important;
background: white;
}








.navbar li a {
color: #616161;
}
ul.topiclist li.header {
display: block;
padding: 5px;
background: #DFDFDF;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
width: 100%;
float: left;
}
li.header dl.icon, .post .inner .corners-top {
min-height: 0;
background: #232222 url(http://i46.servimg.com/u/f46/17/46/69/50/forumh10.png) repeat-x left top;
_background-image: none;
padding: 0;
font: normal 13px 'Droid Sans',Arial, Calibri, Verdana, Geneva, sans-serif;
color: white;
clear: both;
float: left;
border: 1px solid #0D0D0D;
width: 100%;
-moz-box-shadow: 0px 0px 3px #080808;
-webkit-box-shadow: 0px 0px 3px #080808;
box-shadow: 0px 0px 3px #080808;
padding: 4px 0;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
height: 23px;
}
.topiclist.forums, ul.topiclist.bg_none {
padding-top: 44px;
}
.topiclist.forums li.row {
margin-bottom: 1px;
border-bottom: 1px solid #EEE;
}




#tabs {
border-bottom: #165B6F 5px solid;
}
#tabs li.activetab {
text-align: center;
padding-left: 10px;
padding-right: 10px;
float: left;
height: 25px;
min-width: 55px;
display: inline;
margin-left: -1;
margin-bottom: -1;
border-radius-topleft: 3px;
-moz-border-radius-topleft: 3px;
-moz-border-radius-topright: 3px;
-webkit-border-top-left-radius: 3px;
-webkit-border-top-right-radius: 3px;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
border-style: solid;
border-width: 1px 1px 0px;
border-color: inherit;
color: white;
background-color: #165B6F;
border-color: #114857;
background-image: url('http://i46.servimg.com/u/f46/17/46/69/50/btn-bg10.png');
background-repeat: repeat-x;
}
#tabs li.activetab a span {
color: white !important;
}




a.button1, a.button2, input.button1, input.button2 {
background: #1E7D98 url(http://i46.servimg.com/u/f46/17/46/69/50/btn-bg11.png) top left repeat-x;
border: 1px solid #3b3b3b;
padding: 5px 12px;
cursor: pointer;
color: white;
font-weight: bold;
-moz-box-shadow: 0px 0px 3px #d3d3d3;
-webkit-box-shadow: 0px 0px 3px #d3d3d3;
box-shadow: 0px 0px 3px #d3d3d3;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}
a.button1:hover, a.button2:hover, button.button2:hover, input.button1:hover, input.button2:hover {
background-position: 0 100%;
border: 1px solid black;
color: white;
background: #3b3b3b url(http://i.imgur.com/apO52QN.gif) top left repeat-x;
}




#profile-advanced-layout {
float: right;
width: 100%;
position: relative;
}
#profile-advanced-right {
float: right;
width: 300px;
}
blockquote::before, blockquote::after {
content: "";
position: absolute;
left: 0;
right: 0;
height: 1px;
background-image: -webkit-linear-gradient(left, #EEE, #EEE 35%, #F3A01E 35%, #F3A01E 45%, #D05D2A 45%, #D05D2A 55%, #9DC425 55%, #9DC425 65%, #EEE 65%, #EEE);
background-image: -moz-linear-gradient(left, #EEE, #EEE 35%, #F3A01E 35%, #F3A01E 45%, #D05D2A 45%, #D05D2A 55%, #9DC425 55%, #9DC425 65%, #EEE 65%, #EEE);
background-image: -ms-linear-gradient(left, #EEE, #EEE 35%, #F3A01E 35%, #F3A01E 45%, #D05D2A 45%, #D05D2A 55%, #9DC425 55%, #9DC425 65%, #EEE 65%, #EEE);
background-image: -o-linear-gradient(left, #EEE, #EEE 35%, #F3A01E 35%, #F3A01E 45%, #D05D2A 45%, #D05D2A 55%, #9DC425 55%, #9DC425 65%, #EEE 65%, #EEE);
}
/*---footer----*/








#page-footer {
background: none repeat scroll 0 0 tranparent;
border: 1px solid #DBDBDB;
min-height: 120px;
border-top: 0;
}




.footer-home {
background: url('http://i46.servimg.com/u/f46/17/46/69/50/home10.png') no-repeat;
width: 300px !important;
height: 50px !important;
}
.icon-home {
display: none;
}




.footer-home::before {
content: "Satinacious skin by DigitalvB";
display: block;
  margin-top: 40px;
}
.footer-home::after {
content: "Converted to Fm by Ligerv";
display: block;
}








/*-----viewtopic----*/
.inner .corners-bottom {
background-image: none !important;
margin: 0 !important;
padding-top: 6px;
background: #F7F7F7;
height: 46px !important;
}
.inner span.corners-bottom span {
background-position: 0;
background: #F7F7F7 url(http://i46.servimg.com/u/f46/17/46/69/50/forumh11.png) top center no-repeat;
height: 46px;
}
.topic-actions ~ .post .inner span.corners-top span {
background: url(http://i46.servimg.com/u/f46/17/46/69/50/ibx8db10.png) no-repeat;
border-radius: 2px;
position: relative;
height: 12px;
width: 52px;
margin: 7px 4px 5px 10px;
}
.topic-actions ~ .post.online .inner span.corners-top span {
background: url(http://i46.servimg.com/u/f46/17/46/69/50/iniciu10.png) no-repeat;
border-radius: 2px;
position: relative;
height: 12px;
width: 52px;
margin: 7px 4px 5px 10px;
}
p.author {
margin-top: 10px;
}
.postbody h2.topic-title a {
font-size: 12px;
color: white;
}
.postbody h2.topic-title {
border: none;
margin: -27px 0 0 -20px !important;
position: absolute;
}




.postprofile {
background: transparent url(http://i46.servimg.com/u/f46/17/46/69/50/paper-10.png) no-repeat right top;
margin: 0;
  padding-top: 15px;
}












/*----New Statistics for PHPbb3 by ligerv----*/








div.clear + div.h3 {
display: none;
}
div.h3 {
font-size: 12px;
font-weight: bold;
color: white;
background: #FF3300 url(http://i.imgur.com/BdJcxn4.png) repeat-x left top ;
_background-image: none;
border: 1px solid #114857;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
padding: 8px 10px;
}
div.h3 a[href="/viewonline"] {color : transparent;}
 div.h3 a[href="/viewonline"]::before {
content: "What's Going On?";
  color : #fff;
}
#i_whosonline + p {
border-bottom: 1px solid #E3E3E3;
min-height: 50px;
padding: 15px 0 15px 60px;
background: url('http://i46.servimg.com/u/f46/17/46/69/50/users_10.png') no-repeat 15px center;
padding: 5px 0 5px 60px;
}
#i_whosonline + p br + br {
display: none;
}
#i_whosonline + p em {
display: block;
}
#page-body p.page-bottom {
margin: 0;
margin-left: 60px;
}
div.clear + div.h3 + p + p.page-bottom {
background: url('http://i46.servimg.com/u/f46/17/46/69/50/forum_12.png') no-repeat 15px center;
margin-left: 0 !important;
padding-left: 60px;
position: absolute;
height: 40px;
}
div.clear + div.h3 + p + p + p.page-bottom {
margin-top: 15px !important;
}
div.clear + div.h3 + p + p.page-bottom {
background: url('http://i46.servimg.com/u/f46/17/46/69/50/forum_13.png') no-repeat 15px top;
margin-left: 0 !important;
padding-left: 60px;
position: absolute;
height: 40px;
margin-top: -15px !important;
padding-top: 15px;
}
a[href="/u1"] span {text-shadow: 0px 0px 5px red;font-family: Jellyka BeesAntique Handwriting;}
h2.chatbox-title a.chat-title {color: #000000 !important;}
#chatbox_main_options a, h2.chatbox-title a.chat-title
{
color: #000000 !important;
}
.avatar-index { float: left; }
.avatar-index img { width: 40px; height: 40px; padding: 1px; border: 1px solid #cfcfcf; margin: 0 5px;padding: 1px;}
.table-title h2 {background: none repeat scroll 0% 0% rgb(69, 75, 77) !important;
  border-radius: 5px 5px 5px 5px;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2) inset;
    font-size: 1,5em;
    font-weight: 700;
    margin-left: 35%;
    margin-top: -2px;
    padding: 5px;
    text-align: center;
    text-shadow: 0px 0px 5px rgb(0, 0, 0);
    width: 200px;}
div.h3 {
-moz-border-radius: 3px;
-moz-box-shadow: 0 0 3px #080808;
-webkit-border-radius: 3px;
-webkit-box-shadow: 0 0 3px #080808;
_background-image: none;
background: #232222 url(http://i46.servimg.com/u/f46/17/46/69/50/forumh10.png) repeat-x left top;
border: 1px solid #0D0D0D;
border-radius: 3px;
box-shadow: 0 0 3px #080808;
clear: both;
color: #fff;
float: left;
font-family: 'Droid Sans',Arial,Calibri,Verdana,Geneva,sans-serif;
font-size: 13px;
font-style: normal;
font-variant: normal;
font-weight: normal;
height: 23px;
min-height: 0;
padding: 4px 0;
width: 100%;
}
#chatbox_footer .right div[class][id]{height:20px;margin-right:0;border:0;border-right:1px solid #CFCFCF;background-color:#f5f5f5;padding:7px;cursor:default}#chatbox_footer .right div[class][id]:first-child{border-left:1px solid #CFCFCF}#chatbox_main_options span,#chatbox_main_options label,#chatbox_main_options a{height:34px;margin-right:0;border:0;border-right:1px solid #CFCFCF;background-color:#f5f5f5;padding:7px;color:#000;padding-top:14px}#chatbox_main_options{position:absolute;bottom:0;left:0;z-index:1;color:#818181!important;height:34px;font-size:0;margin:0;margin-bottom:-25px}#chatbox_main_options li a[onclick*="ajax_refresh_chatbox"]{font-size:0;background:url(http://www.arecontvision.com/cool_captcha/icon-reload.gif) no-repeat center #f5f5f5;padding-top:25px;padding-bottom:9px;padding-right:31px;border-top:1px solid #CFCFCF;cursor:default}#chatbox_main_options a[href="/chatbox/index.forum?archives=1"],#chatbox_main_options a[href="/chatbox/index.forum?archives"]{font-size:0;background:url(http://www.dreamtemplate.com/dreamcodes/web_icons/gray-archive-icon.png) no-repeat center whiteSmoke;padding-top:25px;padding-bottom:9px;padding-right:31px;border-top:1px solid #CFCFCF;cursor:default}#chatbox_main_options a[href="/chatbox/index.forum?archives"]{background-color:#E6E6E6}#chatbox_main_options li a[onclick="CB_disconnect();"]{border-right:0;padding:0}#chatbox_main_options li a[onclick="CB_disconnect();"] span{font-size:0;background:url(http://i.imgur.com/xXA8w.gif) no-repeat 50% 50% #f5f5f5;padding-top:25px;padding-bottom:9px;padding-right:31px;border-top:1px solid #CFCFCF;cursor:default}#chatbox_footer{padding:0;background:url() #f5f5f5;border-top:1px solid #CFCFCF;display:block!important;border-radius:0}#chatbox_messenger_form .right {padding:0;font-size:0}#chatbox_messenger_form .right input#message{height:34px;font-weight:normal;background-color:white;background-image:url();border:0;height:34px;margin-bottom:0;font-size:16px;cursor:default;padding:0 0 0 5px;outline:none;width:304px}#chatbox_messenger_form .right input[name="submit_button"]{height:33px;font-size:15px;border:0;background-color:transparent;padding-left:10px;padding-right:11px;margin-left:-4px;cursor:default;font-weight:normal}#chatbox_messenger_form .right img[src="http://illiweb.com/fa/subsilver/wysiwyg/menupop.gif"],#chatbox_members h4.member-title,#chatbox_main_options li#chatbox_option_autorefresh,#chatbox p.clearfix span.date-and-time,#chatbox p.clearfix:hover span.date-and-time{display:none}#chatbox_header{height:0;font-size:0}#chatbox{top:32px;left:0}#chatbox p.clearfix:first-child{padding-top:8px}#chatbox_members{position:absolute;z-index:1;height:31px;left:0;top:0;width:100%;background:url(http://www.addthis.com/forum/styles/addthis2/theme/images/whosonline.gif) 8px -3px no-repeat white;overflow-y:hidden;border-bottom:1px solid #CFCFCF}#chatbox_members li{display:inline;margin-right:0}#chatbox_members a:last-child:after{content:', '}#chatbox_members li:last-child a:last-child:after{content:''}#chatbox_members ul{padding-top:8px;font-size:12px;margin:0;overflow-y:hidden;overflow-x:auto;margin-left:46px;padding-right:8px;padding-bottom:0;white-space:nowrap;height:23px;max-width:none}#chatbox_footer #chatbox_messenger_form .right .fontbutton:hover,#chatbox_header #chatbox_main_options.chatbox-options a:hover,#chatbox_header #chatbox_main_options.chatbox-options span:hover,#chatbox_messenger_form .right input[name="submit_button"]:hover{background-color:#CFCFCF!important}#chatbox_footer #chatbox_messenger_form .right .fontbutton.fontbutton_selected{background-color:#E6E6E6}#chatbox p.clearfix{background-color:#EDEFF4;margin:0;padding:5px;padding-left:0;margin-left:7px;margin-right:7px}#chatbox p.clearfix span.user,#chatbox p.clearfix .msg,#chatbox_main_options li{font-size:0}#chatbox p.clearfix .msg,#chatbox p.clearfix span.user *{font-family:Verdana;font-size:12px}.user a[href*="/u"]{margin-right:8px}.user span:first-child strong{margin-right:4px}.user span:last-child strong{margin-right:0}a[onclick*="ajax_refresh_chatbox"]:hover{background:url(http://www.arecontvision.com/cool_captcha/icon-reload.gif) 50% 50% no-repeat #000!important}#chatbox p.clearfix[class^="chatbox_row_1"] span[style="font-style:italic"]{font-size:15px;font-style:normal!important;margin-left:-66px;background-color:#EDEFF4}#chatbox p.chatbox_row_1.clearfix:first-child span[style="font-style:italic"]:last-child{font-size:0px}#chatbox p.chatbox_row_1.clearfix:first-child span[title]:first-child{visibility:hidden}#chatbox p.chatbox_row_1.clearfix:first-child span[style="font-style:italic"]:last-child:before{margin-left:7px;background:url(http://i.imgur.com/xXA8w.gif) top left no-repeat;background-size:20px;padding-left:22px;content:'Entre para conversar';font-size:15px}#chatbox_contextmenu{z-index:1}#chatbox_messenger_form{margin-top:0px}.user-msg{display:inline-block;padding-left:38px;background:url(http://i.imgur.com/BMdww.gif) no-repeat top left;background-size:32px 32px;min-height:32px}.user-msg .msg{display:block}.user-msg .msg span{border-image-width:0px;border:0px;border-image-source:url(http://i.imgur.com/BMdww.gif)}
div.postprofile dl dt 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;
}
 
div.postprofile dl dt img:hover {
    -webkit-transform: rotate(-7deg);
    -moz-transform: rotate(-7deg);
    -o-transform: rotate(-7deg);
}


Html menu Logado:

Código:
<div id='cssmenu'>
<ul>
   <li><a href='http://narutorpgorigens.forumeiros.com/forum'><span>Fórum</span></a></li>
   <li><a href='http://narutorpgorigens.forumeiros.com/portal'><span>Portal</span></a></li>
   <li class='has-sub'><a href='http://narutorpgorigens.forumeiros.com/profile?mode=editprofile'><span>Perfil</span></a>
      <ul>
         <li><a href='http://narutorpgorigens.forumeiros.com/profile?mode=editprofile&page_profil=preferences'><span>Preferências</span></a></li>
         <li><a href='http://narutorpgorigens.forumeiros.com/profile?mode=editprofile&page_profil=signature'><span>Assinatura</span></a></li>
         <li><a href='http://narutorpgorigens.forumeiros.com/profile?mode=editprofile&page_profil=avatars'><span>Avatar</span></a></li>
         <li class='last'><a href='http://narutorpgorigens.forumeiros.com/profile?mode=editprofile&page_profil=friendsfoes'><span>Amigos e Ignorados</span></a></li>
      </ul>
   </li>
   <li><a href='http://narutorpgorigens.forumeiros.com/memberlist'><span>Membros</span></a></li>
   <li><a href='http://narutorpgorigens.forumeiros.com/privmsg?folder=inbox'><span>Mensagens Privadas</span></a></li>
   <li class='last'><a href='http://narutorpgorigens.forumeiros.com/login?logout'><span>Sair</span></a></li>
</ul>
</div>


Css Menu logado:

Código:
@import url(http://fonts.googleapis.com/css?family=Open+Sans:600);












/* Menu CSS */ 




#cssmenu, #cssmenu > ul{
   
   background: url(highlight-bg.png) repeat;
   padding-bottom: 3px;
   font-family: 'Open Sans', sans-serif;
   font-weight: 600;
   
   
}




#cssmenu:before, #cssmenu:after, #cssmenu > ul:before, #cssmenu > ul:after {




   content: '';
   display: table;
   
}








#cssmenu:after, #cssmenu > ul:after {




   clear: both;
   
}




#cssmenu {




   zoom:1;
   
}




#cssmenu > ul{
   
   background: url(menu-bg.png) repeat;
   margin: 0;
   padding: 0;
   position: relative;
   
}




#cssmenu > ul li{
   
   margin: 0;
   padding: 0;
   list-style: none;
   
}




#cssmenu > ul > li{




   float: left;
   position: relative;
   
}




#cssmenu > ul > li > a{




   padding: 23px 26px;
   display: block;
   color: white;
   font-size: 13px;
   text-decoration: none;
   text-transform: uppercase;
   text-shadow: 0 -1px 0 #0d0d0d;
   text-shadow: 0 -1px 0 rgba(0, 0, 0, .70);
   line-height: 18px;
   
}








#cssmenu > ul > li:hover > a{




   background: url(highlight-bg.png) repeat;
   text-shadow: 0 -1px 0 #97321f;
   text-shadow: 0 -1px 0 rgba(122, 42, 26, .64);
   
}




#cssmenu > ul > li > a > span{




   line-height: 18px;
   
}




#cssmenu > ul > li.active > a, #cssmenu > ul > li > a:active{
   
   background: url(hover.png) repeat;
   
}












/* Childs */




#cssmenu > ul ul{




   opacity: 0;
   visibility: hidden;
   position: absolute;
   top: 120px;
   background: url(menu-bg.png) repeat;
   margin: 0;
   padding: 0;
   z-index: -1;




   
}




#cssmenu > ul li:hover ul{
   opacity: 1;
   visibility: visible;
   margin: 0;
   color: #000;
   z-index: 2;
   top:64px;
   left: 0;
   
}




#cssmenu > ul ul:before{




   content: '';
   position: absolute;
   top: -10px;
   width: 100%;
   height: 20px;
   background: transparent;
   
}








#cssmenu > ul ul li{




   list-style: none;
   padding: 0;
   margin: 0;
   width: 100%;
   
}




#cssmenu > ul ul li a{




   padding: 18px 26px;
   display: block;
   color: white;
   font-size: 13px;
   text-decoration: none;
   text-transform: uppercase;
   width: 150px;
   border-left: 4px solid transparent;
   -webkit-transition: all .35s ease-in-out;
   -moz-transition: all .35s ease-in-out;
   -ms-transition: all .35s ease-in-out;
   transition: all .35s ease-in-out;




}




#cssmenu > ul ul li a:hover{




   border-left: 4px solid #d64e34;
   background: url(hover.png) repeat;




}




#cssmenu > ul ul li a:active{




   background: url(menu-bg.png) repeat;




}


html Menu convidado:

Código:
<div id='cssmenu'>
<ul>
   <li><a href='http://narutorpgorigens.forumeiros.com/forum'><span>Fórum</span></a></li>
   <li><a href='http://narutorpgorigens.forumeiros.com/portal'><span>Portal</span></a></li>
   <li><a href='http://narutorpgorigens.forumeiros.com/memberlist'><span>Membros</span></a></li>
   <li><a href='http://narutorpgorigens.forumeiros.com/groups'><span>Grupos</span></a></li>
   <li><a href='http://narutorpgorigens.forumeiros.com/register'><span>Registre-se</span></a></li>
   <li class='last'><a href='http://narutorpgorigens.forumeiros.com/login'><span>Login</span></a></li>
</ul>
</div>


css Menu convidado:

Código:
@import url(http://fonts.googleapis.com/css?family=Open+Sans:600);












/* Menu CSS */ 




#cssmenu, #cssmenu > ul{
   
   background: url(highlight-bg.png) repeat;
   padding-bottom: 3px;
   font-family: 'Open Sans', sans-serif;
   font-weight: 600;
   
   
}




#cssmenu:before, #cssmenu:after, #cssmenu > ul:before, #cssmenu > ul:after {




   content: '';
   display: table;
   
}








#cssmenu:after, #cssmenu > ul:after {




   clear: both;
   
}




#cssmenu {




   zoom:1;
   
}




#cssmenu > ul{
   
   background: url(menu-bg.png) repeat;
   margin: 0;
   padding: 0;
   position: relative;
   
}




#cssmenu > ul li{
   
   margin: 0;
   padding: 0;
   list-style: none;
   
}




#cssmenu > ul > li{




   float: left;
   position: relative;
   
}




#cssmenu > ul > li > a{




   padding: 23px 26px;
   display: block;
   color: white;
   font-size: 13px;
   text-decoration: none;
   text-transform: uppercase;
   text-shadow: 0 -1px 0 #0d0d0d;
   text-shadow: 0 -1px 0 rgba(0, 0, 0, .70);
   line-height: 18px;
   
}








#cssmenu > ul > li:hover > a{




   background: url(highlight-bg.png) repeat;
   text-shadow: 0 -1px 0 #97321f;
   text-shadow: 0 -1px 0 rgba(122, 42, 26, .64);
   
}




#cssmenu > ul > li > a > span{




   line-height: 18px;
   
}




#cssmenu > ul > li.active > a, #cssmenu > ul > li > a:active{
   
   background: url(hover.png) repeat;
   
}












/* Childs */




#cssmenu > ul ul{




   opacity: 0;
   visibility: hidden;
   position: absolute;
   top: 120px;
   background: url(menu-bg.png) repeat;
   margin: 0;
   padding: 0;
   z-index: -1;




   
}




#cssmenu > ul li:hover ul{
   opacity: 1;
   visibility: visible;
   margin: 0;
   color: #000;
   z-index: 2;
   top:64px;
   left: 0;
   
}




#cssmenu > ul ul:before{




   content: '';
   position: absolute;
   top: -10px;
   width: 100%;
   height: 20px;
   background: transparent;
   
}








#cssmenu > ul ul li{




   list-style: none;
   padding: 0;
   margin: 0;
   width: 100%;
   
}




#cssmenu > ul ul li a{




   padding: 18px 26px;
   display: block;
   color: white;
   font-size: 13px;
   text-decoration: none;
   text-transform: uppercase;
   width: 150px;
   border-left: 4px solid transparent;
   -webkit-transition: all .35s ease-in-out;
   -moz-transition: all .35s ease-in-out;
   -ms-transition: all .35s ease-in-out;
   transition: all .35s ease-in-out;




}




#cssmenu > ul ul li a:hover{




   border-left: 4px solid #d64e34;
   background: url(hover.png) repeat;




}




#cssmenu > ul ul li a:active{




   background: url(menu-bg.png) repeat;




}

att.

@EDIT: Quero ele no topo, não em baixo do logo.
Endereço do meu fórum:
http://narutorpgorigens.forumeiros.com

Versão do fórum:
PHPBB3


Última edição por Legollas em 06/03/13, 03:40 pm, editado 2 vez(es) (Razão : @EDIT: Quero ele no topo, não em baixo do logo.)
avatar

r. Felp
Nível 6

Masculino
Inscrito dia : 02/02/2013
Mensagens : 64
Pontos Ativos : 103

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

Resolvido Re: Css menu maker

Mensagem por r. Felp em 04/03/13, 12:43 pm

Me ajuda por favor.
avatar

r. Felp
Nível 6

Masculino
Inscrito dia : 02/02/2013
Mensagens : 64
Pontos Ativos : 103

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

Resolvido Re: Css menu maker

Mensagem por r. Felp em 04/03/13, 02:39 pm

Por favor, me ajudem, é urgente, preciso dele rapido.


att.
avatar

r. Felp
Nível 6

Masculino
Inscrito dia : 02/02/2013
Mensagens : 64
Pontos Ativos : 103

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

Resolvido Re: Css menu maker

Mensagem por r. Felp em 04/03/13, 03:42 pm

Por favor galera, eu preciso da ajuda rapida, por favor mesmo, me ajudem.
avatar

r. Felp
Nível 6

Masculino
Inscrito dia : 02/02/2013
Mensagens : 64
Pontos Ativos : 103

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

Resolvido Re: Css menu maker

Mensagem por r. Felp em 04/03/13, 04:24 pm

Por favor me ajudem, eu estou precisando muito mesmo. Por Favor.
avatar

r. Felp
Nível 6

Masculino
Inscrito dia : 02/02/2013
Mensagens : 64
Pontos Ativos : 103

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

Resolvido Re: Css menu maker

Mensagem por Tsumetai em 04/03/13, 06:32 pm

Vá em:

<blockquote>
Módulos > Portal e Widgets > Gestão dos Widgets do Forúm >> Criar um Widget personalizado.</blockquote>
Nome do widget : Coloque Menu convidado;
Utilizar um table type : Marque Não;
Título do widget : Não coloque nada aqui;
Fonte do widget * : Siga os passos abaixo:

Podemos ver quando estamos montando o menu, que tem 3 abas na área de visualização:


Vamos primeiro montar o menu para quem está logado. Em Fonte do widget * : cole o código abaixo:

Clique para ver o codigo:
Código:
<script>$(document).ready(function(){
$('body').prepend("<div id='backgroundmenu'><div id='cssmenu'><ul><li><a href='http://narutorpgorigens.forumeiros.com/forum'><span>Fórum</span></a></li><li><a href='http://narutorpgorigens.forumeiros.com/portal'><span>Portal</span></a></li><li><a href='http://narutorpgorigens.forumeiros.com/memberlist'><span>Membros</span></a></li><li><a href='http://narutorpgorigens.forumeiros.com/groups'><span>Grupos</span></a></li><li><a href='http://narutorpgorigens.forumeiros.com/register'><span>Registre-se</span></a></li><li class='last'><a href='http://narutorpgorigens.forumeiros.com/login'><span>Login</span></a></li></ul></div></div>");});</script><style>        @import url(http://fonts.googleapis.com/css?family=Open+Sans:600);
/* Menu CSS */
#cssmenu, #cssmenu > ul{
         
          background: url(highlight-bg.png) repeat;
          padding-bottom: 3px;
          font-family: 'Open Sans', sans-serif;
          font-weight: 600;
         
         
        }




        #cssmenu:before, #cssmenu:after, #cssmenu > ul:before, #cssmenu > ul:after {




          content: '';
          display: table;
         
        }








        #cssmenu:after, #cssmenu > ul:after {




          clear: both;
         
        }




        #cssmenu {




          zoom:1;
         
        }




        #cssmenu > ul{
         
          background: url(menu-bg.png) repeat;
          margin: 0;
          padding: 0;
          position: relative;
         
        }




        #cssmenu > ul li{
         
          margin: 0;
          padding: 0;
          list-style: none;
         
        }




        #cssmenu > ul > li{




          float: left;
          position: relative;
         
        }




        #cssmenu > ul > li > a{




          padding: 23px 26px;
          display: block;
          color: white;
          font-size: 13px;
          text-decoration: none;
          text-transform: uppercase;
          text-shadow: 0 -1px 0 #0d0d0d;
          text-shadow: 0 -1px 0 rgba(0, 0, 0, .70);
          line-height: 18px;
         
        }








        #cssmenu > ul > li:hover > a{




          background: url(highlight-bg.png) repeat;
          text-shadow: 0 -1px 0 #97321f;
          text-shadow: 0 -1px 0 rgba(122, 42, 26, .64);
         
        }




        #cssmenu > ul > li > a > span{




          line-height: 18px;
         
        }




        #cssmenu > ul > li.active > a, #cssmenu > ul > li > a:active{
         
          background: url(hover.png) repeat;
         
        }












        /* Childs */




        #cssmenu > ul ul{




          opacity: 0;
          visibility: hidden;
          position: absolute;
          top: 120px;
          background: url(menu-bg.png) repeat;
          margin: 0;
          padding: 0;
          z-index: -1;




         
        }




        #cssmenu > ul li:hover ul{
          opacity: 1;
          visibility: visible;
          margin: 0;
          color: #000;
          z-index: 2;
          top:64px;
          left: 0;
         
        }




        #cssmenu > ul ul:before{




          content: '';
          position: absolute;
          top: -10px;
          width: 100%;
          height: 20px;
          background: transparent;
         
        }








        #cssmenu > ul ul li{




          list-style: none;
          padding: 0;
          margin: 0;
          width: 100%;
         
        }




        #cssmenu > ul ul li a{




          padding: 18px 26px;
          display: block;
          color: white;
          font-size: 13px;
          text-decoration: none;
          text-transform: uppercase;
          width: 150px;
          border-left: 4px solid transparent;
          -webkit-transition: all .35s ease-in-out;
          -moz-transition: all .35s ease-in-out;
          -ms-transition: all .35s ease-in-out;
          transition: all .35s ease-in-out;




        }




        #cssmenu > ul ul li a:hover{




          border-left: 4px solid #d64e34;
          background: url(hover.png) repeat;




        }




        #cssmenu > ul ul li a:active{background: url(menu-bg.png) repeat; }
#backgroundmenu {position: relative; width: 100%;}
</style>

Salve o Widjet
Após salvar clique no botão destacado na img:

Marque apenas 'Convidado'




Agora, crie um novo widget. Com o seguinte conteúdo.
Nome do widget : Coloque Menu logado;
Utilizar um table type : Marque Não;
Título do widget : Não coloque nada aqui;
Fonte do widget * : Siga os passos abaixo:

Clique para ver o codigo:
Código:
<script>$(document).ready(function(){
$('body').prepend("<div id='backgroundmenu'><div id='cssmenu'><ul><li><a href='http://narutorpgorigens.forumeiros.com/forum'><span>Fórum</span></a></li><li><a href='http://narutorpgorigens.forumeiros.com/portal'><span>Portal</span></a></li><li class='has-sub'><a href='http://narutorpgorigens.forumeiros.com/profile?mode=editprofile'><span>Perfil</span></a><ul><li><a href='http://narutorpgorigens.forumeiros.com/profile?mode=editprofile&page_profil=preferences'>]<span>Preferências</span></a></li><li><a href='http://narutorpgorigens.forumeiros.com/profile?mode=editprofile&page_profil=signature'><span>Assinatura</span></a></li><li><a href='http://narutorpgorigens.forumeiros.com/profile?mode=editprofile&page_profil=avatars'><span>Avatar</span></a></li><li class='last'><a href='http://narutorpgorigens.forumeiros.com/profile?mode=editprofile&page_profil=friendsfoes'><span>Amigos e Ignorados</span></a></li></ul></li><li><a href='http://narutorpgorigens.forumeiros.com/memberlist'><span>Membros</span></a></li><li><a href='http://narutorpgorigens.forumeiros.com/privmsg?folder=inbox'><span>Mensagens Privadas</span></a></li><li class='last'><a href='http://narutorpgorigens.forumeiros.com/login?logout='><span>Sair</span></a></li></ul></div></div>");});</script>
<style>        @import url(http://fonts.googleapis.com/css?family=Open+Sans:600);












        /* Menu CSS */




        #cssmenu, #cssmenu > ul{
         
          background: url(highlight-bg.png) repeat;
          padding-bottom: 3px;
          font-family: 'Open Sans', sans-serif;
          font-weight: 600;
         
         
        }




        #cssmenu:before, #cssmenu:after, #cssmenu > ul:before, #cssmenu > ul:after {




          content: '';
          display: table;
         
        }








        #cssmenu:after, #cssmenu > ul:after {




          clear: both;
         
        }




        #cssmenu {




          zoom:1;
         
        }




        #cssmenu > ul{
         
          background: url(menu-bg.png) repeat;
          margin: 0;
          padding: 0;
          position: relative;
         
        }




        #cssmenu > ul li{
         
          margin: 0;
          padding: 0;
          list-style: none;
         
        }




        #cssmenu > ul > li{




          float: left;
          position: relative;
         
        }




        #cssmenu > ul > li > a{




          padding: 23px 26px;
          display: block;
          color: white;
          font-size: 13px;
          text-decoration: none;
          text-transform: uppercase;
          text-shadow: 0 -1px 0 #0d0d0d;
          text-shadow: 0 -1px 0 rgba(0, 0, 0, .70);
          line-height: 18px;
         
        }








        #cssmenu > ul > li:hover > a{




          background: url(highlight-bg.png) repeat;
          text-shadow: 0 -1px 0 #97321f;
          text-shadow: 0 -1px 0 rgba(122, 42, 26, .64);
         
        }




        #cssmenu > ul > li > a > span{




          line-height: 18px;
         
        }




        #cssmenu > ul > li.active > a, #cssmenu > ul > li > a:active{
         
          background: url(hover.png) repeat;
         
        }












        /* Childs */




        #cssmenu > ul ul{




          opacity: 0;
          visibility: hidden;
          position: absolute;
          top: 120px;
          background: url(menu-bg.png) repeat;
          margin: 0;
          padding: 0;
          z-index: -1;




         
        }




        #cssmenu > ul li:hover ul{
          opacity: 1;
          visibility: visible;
          margin: 0;
          color: #000;
          z-index: 2;
          top:64px;
          left: 0;
         
        }




        #cssmenu > ul ul:before{




          content: '';
          position: absolute;
          top: -10px;
          width: 100%;
          height: 20px;
          background: transparent;
         
        }








        #cssmenu > ul ul li{




          list-style: none;
          padding: 0;
          margin: 0;
          width: 100%;
         
        }




        #cssmenu > ul ul li a{




          padding: 18px 26px;
          display: block;
          color: white;
          font-size: 13px;
          text-decoration: none;
          text-transform: uppercase;
          width: 150px;
          border-left: 4px solid transparent;
          -webkit-transition: all .35s ease-in-out;
          -moz-transition: all .35s ease-in-out;
          -ms-transition: all .35s ease-in-out;
          transition: all .35s ease-in-out;




        }




        #cssmenu > ul ul li a:hover{




          border-left: 4px solid #d64e34;
          background: url(hover.png) repeat;




        }




        #cssmenu > ul ul li a:active{




          background: url(menu-bg.png) repeat;




        }
#backgroundmenu {position: relative; width: 100%;}
</style>

Após salvar clique no botão destacado na img:


Desmarque 'Convidados' e marque todas as outras opções.
avatar

Tsumetai
Nível 9

Masculino
Inscrito dia : 17/01/2012
Mensagens : 154
Pontos Ativos : 221

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

Resolvido Re: Css menu maker

Mensagem por Sennior em 05/03/13, 09:54 pm

Saudações!

O senhor deseja coloca-lo no menu? Se sim, infelizmente não há como amigo, apenas por edições de Templates. Perdoe-me se entendi errado, ou simplifique mais.

Até mais! Muito feliz
avatar

Sennior
Membro profissional
Membro profissional

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16302
Pontos Ativos : 20791

Ver perfil do usuário http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Css menu maker

Mensagem por r. Felp em 06/03/13, 03:40 pm

Pode bloquear.
avatar

r. Felp
Nível 6

Masculino
Inscrito dia : 02/02/2013
Mensagens : 64
Pontos Ativos : 103

Ver perfil do usuário http://narutorpgorigens.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