Горизонтальное меню

Здесь задаём вопросы и получаем ответы по системе uCoz!
Правила форума
1. Темы с названиями Помогите, Как сделать, Хелп, Не могу найти и так далее будут перенесении в мусорку без предупреждения!
2. Любой транс-лит будет удален, так что подумайте стоит ли писать транс-литом.
3. Темы не по тематике этого раздела будут также перенесены в мусорку. (Например по DLE, phpBB, php скриптам и так далее...)
4. Не забываем про Общие правила форума!
Ответить
Ichi28
Сообщения: 113
Зарегистрирован: 30 янв 2009, 23:28

Горизонтальное меню

Сообщение Ichi28 »

Код: Выделить всё

/* ---------MENU--------------- */
#nav, #nav ul {
 list-style: none;
 margin: 0;
 padding: 0;
 border: 1px solid #000;
 background: #000000;
 float: left;
 width: 100%;
}
#nav li {
 float: left;
 position: relative;
 background: #000000;
 back\ground: none;
}

#nav a {
 color: #fff;
 text-decoration: none;
 display: block;
 width: 120px;
 background: #000000 repeat-y right;; padding-left:10px; padding-right:10px; padding-top:4px; padding-bottom:4px
}
#nav a:hover {
 color: #000;
 background: #ccc;
}
#nav li:hover,
#nav li.jshover {
 background: #333;
}

#nav li ul {
 display: none;
 position: absolute;
 background: url('http://kinowood.ucoz.ru/diz/cont.png');
 width: 138px; padding-left:0; padding-right:0; padding-top:8px; padding-bottom:8px
}
#nav li li a {
 width: 118px;
 background: none;
}
#nav li:hover ul,
#nav li.jshover ul {
 display: block;
}

#nav li:hover li ul,
#nav li.jshover li ul {
 display: none;
 width: 138px;
 top: -9px;
 left: 118px;
 lef\t: 133px;
}
#nav li:hover li:hover ul,
#nav li.jshover li.jshover ul {
 display: block;
}
/* ------------------------ */


Изображение

Как сделать так, что бы при вождении курсора уже в открывшемся меню, пункт, которым оно открылось, был на определенном фоне, а не на том, что задан для строки с пунктами?
Аватара пользователя
ViaT
Сообщения: 20
Зарегистрирован: 24 апр 2009, 14:57

Re: Горизонтальное меню

Сообщение ViaT »

Ichi28, Ты хочешь серые полоски убрать?
Изображение ?
Если да то:

#nav li ul {
display: none;
position: absolute;
background: url('http://kinowood.ucoz.ru/diz/cont.png');
width: 138px; padding-left:0; padding-right:0; padding-top:8px; padding-bottom:8px
}

Я красным выделил что заменять 8-)
Последний раз редактировалось ViaT 07 ноя 2009, 09:33, всего редактировалось 1 раз.
Аватара пользователя
Task
Сообщения: 349
Зарегистрирован: 14 янв 2009, 11:46

Re: Горизонтальное меню

Сообщение Task »

красным? :shock:


Код: Выделить всё

/* ---------MENU--------------- */
#nav, #nav ul {
list-style: none;
margin: 0;
padding: 0;
border: 1px solid #000;
background: #000000;
float: left;
width: 100%;
}
#nav li {
float: left;
position: relative;
background: #000000;
background: none;
}

#nav a {
color: #fff;
text-decoration: none;
display: block;
width: 120px;
background: #000000 repeat-y right;; padding-left:10px; padding-right:10px; padding-top:4px; padding-bottom:4px
}
#nav a:hover {
color: #000;
background: #ccc;
}
#nav li:hover,
#nav li.jshover {
background: #333;
}

#nav li ul {
display: none;
position: absolute;
background: #f2f2f2;
width: 138px; padding-left:0; padding-right:0; padding-top:8px; padding-bottom:8px
}
#nav li li a {
width: 118px;
background: none;
}
#nav li:hover ul,
#nav li.jshover ul {
display: block;
}

#nav li:hover li ul,
#nav li.jshover li ul {
display: none;
width: 138px;
top: -9px;
left: 118px;
left: 133px;
}
#nav li:hover li:hover ul,
#nav li.jshover li.jshover ul {
display: block;
}
/* ------------------------ */


Нужно тут менять цвет:

#nav li ul {
display: none;
position: absolute;
background: #f2f2f2;
width: 138px; padding-left:0; padding-right:0; padding-top:8px; padding-bottom:8px
}
Аватара пользователя
ViaT
Сообщения: 20
Зарегистрирован: 24 апр 2009, 14:57

Re: Горизонтальное меню

Сообщение ViaT »

Task, Не много ошибся =)
Он вроде про фон =)
Аватара пользователя
Task
Сообщения: 349
Зарегистрирован: 14 янв 2009, 11:46

Re: Горизонтальное меню

Сообщение Task »

#nav li ul {
display: none;
position: absolute;
background: url('ССЫЛКА');
width: 138px; padding-left:0; padding-right:0; padding-top:8px; padding-bottom:8px
}
Аватара пользователя
ViaT
Сообщения: 20
Зарегистрирован: 24 апр 2009, 14:57

Re: Горизонтальное меню

Сообщение ViaT »

;)
Ichi28
Сообщения: 113
Зарегистрирован: 30 янв 2009, 23:28

Re: Горизонтальное меню

Сообщение Ichi28 »

Я говорил совсем про другое, наверное плохо объяснил :?

Для того, что бы открыть меню, я навожу курсор на Новости и в это время фон пункта становится другого цвета (не черного). Потом, когда я начинаю вводить курсором уже в открывшемся меню, фон пункта Новости опять становится черным. А как сделать так, что бы он становился другого цвета, что бы было видно, каким пунктом было открыто меню? :?:
Аватара пользователя
Task
Сообщения: 349
Зарегистрирован: 14 янв 2009, 11:46

Re: Горизонтальное меню

Сообщение Task »

Ссылку на сайт. А так смотри в hover.
Ichi28
Сообщения: 113
Зарегистрирован: 30 янв 2009, 23:28

Re: Горизонтальное меню

Сообщение Ichi28 »

Тему можно закрывать, сам разобрался.
Ответить