0 Пользователей и 1 Гость просматривают эту тему.
  • 4 Ответов
  • 1699 Просмотров
*

BoRoDKuH

  • Новичок
  • 12
  • 0 / 0
Дополнительные меню
« : 24.09.2009, 21:19:10 »
У меня такая проблема: нужно создать дополнительные меню для каждого подраздела и категории сайта.
Я их создал - но они отображаются не совсем, так как я хотел. Вот как они отображаются:
А вот так выглядит меню othermenu - шаблона:
Как задать и в каких файлах, чтоб мои ново созданные меню отображались как это othermenu (я говорю про стили (чтоб кнопки так выглядели))

Помогите - очень надо. Я еще нубасик в этих делах.
PS: шаблон it headline.
*

BoRoDKuH

  • Новичок
  • 12
  • 0 / 0
Re: Дополнительные меню
« Ответ #1 : 28.09.2009, 15:33:38 »
Народ  ! Что некто не знает как решить эту проблему ?
*

Antosha

  • Захожу иногда
  • 420
  • 52 / 0
  • Плохо спорить плохо
Re: Дополнительные меню
« Ответ #2 : 28.09.2009, 16:15:45 »
Найдите стили для otermenu и сделайте те же селекторы и структуру для своего меню, тогда все повторится
<a href="http://joomlablog.ru/">JoomlaBlog</a>
*

BoRoDKuH

  • Новичок
  • 12
  • 0 / 0
Re: Дополнительные меню
« Ответ #3 : 03.10.2009, 21:10:57 »
А по-подробней пожалуйста. Я в CSS совсем :o !
Расскажите как это все сделать пожалуйста. Очень надо.
Вот код menus.css
Код
/*---------------------------------------------------------------- 
  Copyright:
  Copyright (C) 2008 IceTheme. All Rights Reserved
 
  License:
  Copyrighted Commercial Software
 
  Author:
  IceTheme - http://wwww.icetheme.com
---------------------------------------------------------------- */


/*---------------
 Main Nav
----------------*/
#main-nav{
height:56px;
margin:0;
width:970px;
position:relative;
overflow:visible;
clear:both;
background-repeat:no-repeat;
background-position:left;}


/* main menu ul or ol elment */
ul#nav{
display:block;
position: absolute;
list-style:none;
margin:0 0 0 10px;
z-index:5;
top:0;
left:0;
display:block;}

/* List items in main menu --[for non-javascript users this applies to submenus as well]  */
ul#nav li {
background:url(../images/nav_border.png) no-repeat center right;
display:block;
list-style:none;
position:relative;
float:left;}

ul#nav li a,
#MainMenuSub a{
text-decoration:none;
display:block;
padding:5px 20px;}

/* Just main menu links --[for non-javascript users this applies to submenu links as well]*/
ul#nav li a{
margin:0;
float:left;
color:#fff;
text-decoration:none;
display:block;
font-size:1.3em;
font-family:Georgia, "Times New Roman", Times, serif;
padding:0 18px 9px;}
ul#nav li a span {
padding-top:9px;
display:block;}
ul#nav li li a span { display:inline; padding-top:0}
ul#nav li a span.sub {
display:block;
font-size:.7em;
padding-top:0;
font-family:Arial, Helvetica, sans-serif;
font-weight:normal;
margin-top:3px;
color:#86B9DA;
letter-spacing:normal}
ul#nav li li a span.sub { display:inline; font-size:1em; margin-top:0;}
ul#nav li li a:hover span.sub { color:#fff}


/* All menu links on hover or focus */
ul#nav li a:hover, ul#nav li a:focus,
#MainMenuSub a:hover, #MainMenuSub a:focus,
ul#nav a.mainMenuParentBtnFocused, #MainMenuSub a.subMenuParentBtnFocused{
background:url(../images/nav_hover.png) repeat-x bottom ;
color:#FFF;}

/* sub menu links on hover or focus */
ul#nav li li a:hover, #nav li a:focus,
#MainMenuSub li a:hover, #MainMenuSub  li a:focus,
#nav a.mainMenuParentBtnFocused, #MainMenuSub a.subMenuParentBtnFocused{
background-image:none;
color:#FFF;}



/* ----[ OLs ULs, LIs, and DIVs ]----*/

/* Submenu Outer Wrapper - each submenu is inside a div with this class - javascript users only */
.smOW{
display:none;
position: absolute;
overflow:hidden;
/*the 2px left & right padding lets you have a 1px border
  on the ul or ol inside since overflow is set to hidden*/
padding:0 2px;
margin:0 0 0 -1px;}


/* All ULs and OLs */
ul#nav ul, ul#nav ol,
#MainMenuSub ul, #MainMenuSub ol {
padding: 0;
margin: 0;
list-style: none;
line-height: 1em;}
ul#nav {
list-style: none;
line-height: 1em;
padding:0;}



/* All submenu OLs and ULs */
ul#nav ul,
#MainMenuSub ul {
left:0;
border-right-width:1px;
border-right-style:solid;}
ul#nav ul li a,
#MainMenuSub ul li a {
padding:0 40px 0 15px;
height:30px;
line-height:31px;
border-bottom-width:1px;
border-bottom-style:solid;}



#MainMenuSub li.parent a {
background:url(../images/nav_drop_arrow.png) no-repeat 96% 55%;}
#MainMenuSub li.parent a:hover {
background-image:url(../images/nav_drop_arrow_hover.png) }

#MainMenuSub li:hover {}


/* When the parent item is set to current or active */
ul#nav  li#current a,
ul#nav  li.active a {
color:#fff;
background:url(../images/nav_current.png) no-repeat bottom}

#MainMenuSub li#current a,
#MainMenuSub li.active a  { color:#fff!important}




#MainMenuSub {
display:block;
position:absolute;
top:0;
left:0;
width:100%;
height:0;
overflow:visible;
z-index:1000000000; }
#MainMenuSub li{ list-style: none;}



/* --------------------------[ The below is just for non-javscript users ]--------------------------*/
#nav li li{ float:none; }

#nav li li a{ /* Just submenu links*/
position:relative;
float:none;
font-size:1em;}

#nav li ul { /* second-level lists */
position: absolute;
width: 18em;
margin-left: -1000em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
margin-top:45px;
}

/* third-and-above-level lists */
#nav li ul ul { margin: -1em 0 0 -1000em; }
#nav li:hover ul ul { margin-left: -1000em; }

 /* lists nested under hovered list items */
#nav li:hover ul{ margin-left: 0; }
#nav li li:hover ul { margin-left: 18em; margin-top:-2.5em;}

/* extra positioning rules for limited noscript keyboard accessibility */
#nav li a:focus + ul {  margin-left: 0; margin-top:45px }
#nav li li a:focus + ul { left:0; margin-left: 1010em; margin-top:-2.2em;}
#nav li li a:focus {left:0;  margin-left:1000em; width:18em;  margin-top:0;}
#nav li li li a:focus {left:0; margin-left: 2010em; width: 18em;  margin-top:-1em;}
#nav li:hover a:focus{ margin-left: 0; }
#nav li li:hover a:focus + ul { margin-left: 18em; }


/*===========================///////////////////-===========================
  OtherMenu
*===========================///////////////////-==========================*/

#othermenu_wrap{
clear:both;
padding:0;
margin-left:-2px;
position:relative;
overflow:visible;}

/* main menu ul or ol elment */
ul#othermenu {
display:block;
position: absolute;
list-style:none;
margin:0;
z-index:5;
top:0;
left:0;
display:block;}

/* List items in main menu --[for non-javascript users this applies to submenus as well]  */
ul#othermenu li {
display:block;
list-style:none;
position:relative;
float:left;}

#OtherMenuSub{
display:block;
position:absolute;
top:0;
left:0;
width:100%;
height:0;
overflow:visible;
z-index:1000000000; }
#OtherMenuSub li{
list-style: none;}

ul#othermenu li a,
#OtherMenuSub a{
text-decoration:none;
display:block;
width:182px;
font-size:1em;
letter-spacing:0.05em;
background: url(../images/othermenu_line.png) no-repeat bottom left;
color:#909090;
text-transform:uppercase;
padding:0 0 0 1px;
height:30px;
margin-top:-1px;
line-height:30px;}
ul#othermenu li a:hover{
color:#333;
background-position:bottom left;}

#OtherMenuSub a:hover{ background-image:none}

ul#othermenu li#current a,
ul#othermenu li.active a,
#OtherMenuSub li#current a {
color:#333}
ul#othermenu  ul li#current a,
ul#othermenu ul li.active a,
#OtherMenuSub ul li#current a { background-image:none}

ul#othermenu li a span{
display:block;}


/* Just sub menu links */

ul#othermenu li li {
width:auto}
#OtherMenuSub a,
ul#othermenu li li a{
text-align:left;
text-transform:none;
font-size:1em;
background-image:none;
width:auto;
border-bottom:1px solid #E1E1D7;
letter-spacing:normal;}
ul#othermenu li a:hover,
#OtherMenuSub a:hover {
color:#333;}


#OtherMenuSub a {
padding:0 40px 0 20px;}

/* Parent Main Menu Links ---[javascript users only]*/

ul#othermenu  li.parent a span,
#OtherMenuSub li.parent a {
background: url(../images/othermenu_arrow_parent.png) 95% 55% no-repeat;}
ul#othermenu  li.parent a:hover span,
#OtherMenuSub li.parent a:hover  {
background-image:url(../images/othermenu_arrow_parent_hover.png) }

ul#othermenu  li.parent li a span,
#OtherMenuSub li.parent li a {
background: url(../images/othermenu_arrow_parent_2.png) 95% 55% no-repeat;}
ul#othermenu  li.parent li a:hover span,
#OtherMenuSub li.parent li a:hover {
background-image:url(../images/othermenu_arrow_parent_2_hover.png) }




/* ----[ OLs ULs, LIs, and DIVs ]----*/

/* All submenu OLs and ULs */
ul#othermenu ol, ul#othermenu ul, #OtherMenuSub ul, #OtherMenuSub ol {
/*border around submenu goes here*/
border:1px solid #E1E1D7;
border-bottom:none;
left:0;
background:#F6F4F2}

/* All ULs and OLs */
ul#othermenu, ul#othermenu ul, ul#othermenu ol, #OtherMenuSub ul, #OtherMenuSub ol {
padding: 0;
margin: 0;
list-style: none;
line-height: 1em;
}



/* --------------------------[ The below is just for non-javscript users ]--------------------------*/

ul#othermenu li li{ float:none; }

ul#othermenu li li a{ /* Just submenu links*/
position:relative;
float:none;
}

ul#othermenu li ul { /* second-level lists */
position: absolute;
width: 10em;
z-index:999999;
overflow:visible;
visibility:visible;
margin-left: -1000em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}

/* third-and-above-level lists */
ul#othermenu li ul ul { margin: -1em 0 0 -1000em; }
ul#othermenu li:hover ul ul { margin-left: -1000em; }

 /* lists nested under hovered list items */
ul#othermenu li:hover ul{ margin-left: 186px; margin-top:-2.5em;}
ul#othermenu li li:hover ul { margin-left: 10em; }

/* extra positioning rules for limited noscript keyboard accessibility */
ul#othermenu li a:focus + ul {  margin-left: 186px; margin-top:-2.5em; }
ul#othermenu li li a:focus + ul { left:186px; margin-left: 1010em; margin-top:-2.5em;}
ul#othermenu li li a:focus {left:186px;  margin-left:1000em; width:10em;  margin-top:-2.5em;}
ul#othermenu li li li a:focus {left:186px; margin-left: 2010em; width: 10em;  margin-top:-2.5em;}
ul#othermenu li:hover a:focus{ margin-left: 0; }
ul#othermenu li li:hover a:focus + ul { margin-left: 10em; }

/*===========================///////////////////-===========================
            Top Menu
===========================///////////////////-===========================*/
ul#topmenu {
margin:3px 0 0 6px;
float:left;}
ul#topmenu li{
list-style-type:none;
display:inline;
margin:0;
border-right:1px solid #C7C7C7}
ul#topmenu li a{
font-size:1em;
margin:0 7px;
font-size:.9em;
color:#1F648F;}
ul#topmenu li a:hover{}
ul#topmenu li a span {}
ul#topmenu li a:hover span {}


/*===========================///////////////////-===========================
            Footer Links
===========================///////////////////-===========================*/

ul#footerlinks {
float:left;
width:100%;
margin:0 auto;
position:relative;
overflow:hidden;
text-align:center;
padding:0 0 12px;
margin:0 0 12px;
border-bottom:1px dashed #B2B2B2}
ul#footerlinks li{
list-style-type:none;
display:inline;
margin:0 0 0 15px;
border-right:1px dotted #A6A6A6}
ul#footerlinks li a{
margin-right:15px;
font-size:1em;
letter-spacing:0.05em;
text-transform:uppercase;
color:#888;}
ul#footerlinks li a:hover{
color:#222;
text-decoration:none;}
ul#footerlinks li#current a { color:#222}

/*===========================///////////////////-===========================
            Footer Menu
===========================///////////////////-===========================*/
ul#footermenu {
float:right;
margin:0 50px 0 0; }
ul#footermenu li{
list-style-type:none;
float:left;
margin:0 0 0 10px;}
ul#footermenu li a{ margin-right:10px;}
*

BoRoDKuH

  • Новичок
  • 12
  • 0 / 0
Re: Дополнительные меню
« Ответ #4 : 03.10.2009, 21:57:03 »
Вот сделал копию и исправил под себя раздел CSS othermenu
Код
/*===========================///////////////////-===========================
              Слуховые Аппараты
*===========================///////////////////-==========================*/

#sluhmenu_wrap{
clear:both;
padding:0;
margin-left:-2px;
position:relative;
overflow:visible;}

/* main menu ul or ol elment */
ul#sluhmenu {
display:block;
position: absolute;
list-style:none;
margin:0;
z-index:5;
top:0;
left:0;
display:block;}

/* List items in main menu --[for non-javascript users this applies to submenus as well]  */
ul#sluhmenu li {
display:block;
list-style:none;
position:relative;
float:left;}

#SluhMenuSub{
display:block;
position:absolute;
top:0;
left:0;
width:100%;
height:0;
overflow:visible;
z-index:1000000000; }
#SluhMenuSub li{
list-style: none;}

ul#sluhmenu li a,
#SluhMenuSub a{
text-decoration:none;
display:block;
width:182px;
font-size:1em;
letter-spacing:0.05em;
background: url(../images/othermenu_line.png) no-repeat bottom left;
color:#909090;
text-transform:uppercase;
padding:0 0 0 1px;
height:30px;
margin-top:-1px;
line-height:30px;}
ul#sluhmenu li a:hover{
color:#333;
background-position:bottom left;}

#SluhMenuSub a:hover{ background-image:none}

ul#sluhmenu li#current a,
ul#sluhmenu li.active a,
#SluhMenuSub li#current a {
color:#333}
ul#sluhmenu  ul li#current a,
ul#sluhmenu ul li.active a,
#SluhMenuSub ul li#current a { background-image:none}

ul#sluhmenu li a span{
display:block;}


/* Just sub menu links */

ul#sluhmenu li li {
width:auto}
#SluhMenuSub a,
ul#sluhmenu li li a{
text-align:left;
text-transform:none;
font-size:1em;
background-image:none;
width:auto;
border-bottom:1px solid #E1E1D7;
letter-spacing:normal;}
ul#sluhmenu li a:hover,
#SluhMenuSub a:hover {
color:#333;}


#SluhMenuSub a {
padding:0 40px 0 20px;}

/* Parent Main Menu Links ---[javascript users only]*/

ul#sluhmenu  li.parent a span,
#SluhMenuSub li.parent a {
background: url(../images/othermenu_arrow_parent.png) 95% 55% no-repeat;}
ul#sluhmenu  li.parent a:hover span,
#SluhMenuSub li.parent a:hover  {
background-image:url(../images/othermenu_arrow_parent_hover.png) }

ul#sluhmenu  li.parent li a span,
#SluhMenuSub li.parent li a {
background: url(../images/othermenu_arrow_parent_2.png) 95% 55% no-repeat;}
ul#sluhmenu  li.parent li a:hover span,
#SluhMenuSub li.parent li a:hover {
background-image:url(../images/othermenu_arrow_parent_2_hover.png) }




/* ----[ OLs ULs, LIs, and DIVs ]----*/

/* All submenu OLs and ULs */
ul#sluhmenu ol, ul#sluhmenu ul, #SluhMenuSub ul, #SluhMenuSub ol {
/*border around submenu goes here*/
border:1px solid #E1E1D7;
border-bottom:none;
left:0;
background:#F6F4F2}

/* All ULs and OLs */
ul#sluhmenu, ul#sluhmenu ul, ul#sluhmenu ol, #SluhMenuSub ul, #SluhMenuSub ol {
padding: 0;
margin: 0;
list-style: none;
line-height: 1em;
}



/* --------------------------[ The below is just for non-javscript users ]--------------------------*/

ul#sluhmenu li li{ float:none; }

ul#sluhmenu li li a{ /* Just submenu links*/
position:relative;
float:none;
}

ul#sluhmenu li ul { /* second-level lists */
position: absolute;
width: 10em;
z-index:999999;
overflow:visible;
visibility:visible;
margin-left: -1000em; /* using left instead of display to hide menus because display: none isn't read by screen readers */
}

/* third-and-above-level lists */
ul#sluhmenu li ul ul { margin: -1em 0 0 -1000em; }
ul#sluhmenu li:hover ul ul { margin-left: -1000em; }

 /* lists nested under hovered list items */
ul#sluhmenu li:hover ul{ margin-left: 186px; margin-top:-2.5em;}
ul#sluhmenu li li:hover ul { margin-left: 10em; }

/* extra positioning rules for limited noscript keyboard accessibility */
ul#sluhmenu li a:focus + ul {  margin-left: 186px; margin-top:-2.5em; }
ul#sluhmenu li li a:focus + ul { left:186px; margin-left: 1010em; margin-top:-2.5em;}
ul#sluhmenu li li a:focus {left:186px;  margin-left:1000em; width:10em;  margin-top:-2.5em;}
ul#sluhmenu li li li a:focus {left:186px; margin-left: 2010em; width: 10em;  margin-top:-2.5em;}
ul#sluhmenu li:hover a:focus{ margin-left: 0; }
ul#sluhmenu li li:hover a:focus + ul { margin-left: 10em; }

Кнопки появились, но расползлись по экрану.
Как это исправить ?
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Большое меню Joomla

Автор Amakeeva

Ответов: 1
Просмотров: 116
Последний ответ 22.01.2018, 13:17:45
от effrit
Как можно отображать имя пользователя в название меню?

Автор selimoff

Ответов: 27
Просмотров: 3044
Последний ответ 02.01.2018, 15:24:44
от logan-19
как сделать пункт меню не кликабельным?

Автор qweqweqwe

Ответов: 13
Просмотров: 5805
Последний ответ 07.09.2017, 01:45:49
от forzi
Сдвинуть пункты меню в левое положение

Автор wectra

Ответов: 6
Просмотров: 437
Последний ответ 12.07.2017, 21:09:01
от wectra
Не отображаются пункты в меню

Автор physic

Ответов: 16
Просмотров: 15751
Последний ответ 27.05.2017, 00:10:15
от OutLaw1