Страница 1 из 1
Ищу простое горизонтальное меню
Добавлено: 14 фев 2009, 12:48
Gin
Здравствуйте.
Кто может подсказать простое горизонтальное меню с гибкой настройкой.
То есть есть прямоуголники в которых находятся текстовые ссылки. Прямоуголники (кнопки) закрашены каким-то цветом. При наведении мышки на этот прямоуголник - цвет меняется и появляетс явозможность кликнуть. При нажатии на этот прямоугольник - его цвет снова меняется и свойства текстовой ссылки тоже меняются (цвет, жирность).
Излазил весь инет...ничего подобного не нащёл. Всё или очень сложные и не во всех браузерах работают, либо есть что-то подобное, но не хватает нескольких элементов выделения.
Знаю, что это делается обычной таблицей и свойствами css, но я плохо в этом разбираюсь. Пожскажите, кому не сложно...
Re: Ищу простое горизонтальное меню
Добавлено: 14 фев 2009, 14:11
Smoke
Re: Ищу простое горизонтальное меню
Добавлено: 14 фев 2009, 15:55
Gin
у них у всех не работает активное выделение. видимо в юкоз с этим загвоздка. я уже десятк меню перебрал
Re: Ищу простое горизонтальное меню
Добавлено: 14 фев 2009, 16:02
Gin
файл стилей
Код: Выделить всё
ul#menu{
width: 100%;
height: 43px;
background: #FFF url("images/menu-bg.gif") top left repeat-x;
font-size: 0.8em;
font-family: "Lucida Grande", Verdana, sans-serif;
font-weight: bold;
list-style-type: none;
margin: 0;
padding: 0;
}
ul#menu li {
display: block;
float: left;
margin: 0 0 0 5px;
}
ul#menu li a {
height: 43px;
color: #777;
text-decoration: none;
display: block;
float: left;
line-height: 200%;
padding: 8px 15px 0;
}
ul#menu li a:hover {
color: #333;
}
ul#menu li a.current{
color: #FFF;
background: #FFF url("images/current-bg.gif") top left repeat-x;
padding: 5px 15px 0;
}
файл шаблона
Код: Выделить всё
<ul id="menu">
<li><a href="#" target="_self" title="sample" class="current">sample</a></li>
<li><a href="#" target="_self" title="sample">sample</a></li>
<li><a href="#" target="_self" title="sample">sample</a></li>
<li><a href="#" target="_self" title="sample">sample</a></li>
<li><a href="#" target="_self" title="sample">sample</a></li>
</ul>
Что здесь надо менять, чтобы в системе укоз работало?
в админке есть надпись "Если вы сами настраиваете дизайн вашего сайта и используете свои таблицы стилей, то вам будет полезно знать, что активный пункт меню имеет класс ma (class="ma")."
Я не понимаю, что она значит и как это переделать...
Re: Ищу простое горизонтальное меню
Добавлено: 15 фев 2009, 00:40
Lexx
ul#menu{
width: 100%;
height: 43px;
background: #FFF url("images/menu-bg.gif") top left repeat-x;
font-size: 0.8em;
font-family: "Lucida Grande", Verdana, sans-serif;
font-weight: bold;
list-style-type: none;
margin: 0;
padding: 0;
}
ul#menu li {
display: block;
float: left;
margin: 0 0 0 5px;
}
ul#menu li a {
height: 43px;
color: #777;
text-decoration: none;
display: block;
float: left;
line-height: 200%;
padding: 8px 15px 0;
}
ul#menu li a:hover {
color: #333;
}
ul#menu li a.current{
color: #FFF;
background: #FFF url("images/current-bg.gif") top left repeat-x;
padding: 5px 15px 0;
}
эти картинки залиты?