
	Добро пожаловать в студию графики и веб-дизайна Art-Color

Добро пожаловать на StudioAC.ru. Наша дизайн студия занимается разработкой web сайтов, созданием дизайнов сайта.Так как большенство людей не умеют, или не имеют возможности рисовать профессиональную графику, мы делаем это за них.Графика для сайтов - это создание баннеров, создание шапки и остально мелочи которая нужна что бы ваш сайт был привлекательным и запомнился посетителю. Так же наш сайт предоставляет готовую графику. В неё входят готовые шаблоны сайтов, только уникальные скрипты, кнопки для сайтов а так же PSD файлы. Мы выкладываем только авторские изделия, то есть все что есть у нас на сайте - это все работа нашей команды.

Вертикальное выдвижное меню

16.07.2025

Вертикальное выдвижное меню на jQuery/CSS.

Не используется ни единая картинка,можно настроить меню под любой дизайн.

1.В <head></head> подключаем скрипт:

Code

2.В CSS где угодно вставляем:

Code

ul#menu, ul#menu ul {
  list-style-type:none;
  margin: 0;
  padding: 0;
  width: 15em;
}

ul#menu a {
  display: block;
  text-decoration: none;
}

ul#menu li {
  margin-top: 1px;
}

ul#menu li a {
  background: #333 /* Фон меню */;
  color: #fff;
  padding: 0.5em;
}

ul#menu li a:hover {
  background: #000 /* Фон при наведении */;
}

ul#menu li ul li a {
  background: #ccc /* Фон подменю */;
  color: #000;
  padding-left: 20px;
}

ul#menu li ul li a:hover {
  background: #aaa / Фон подменю при наведении */;
  border-left: 5px #000 solid;
  padding-left: 15px;
}

3. Там где хотим видеть меню ставим:
<ul id="menu">

Code

<ul id="menu"><li>
  <a href="#">Главная</a>
  <ul>
  <li><a href="#">Ссылка</a></li>
  <li><a href="#">Ссылка</a></li>
  <li><a href="#">Ссылка</a></li>
  <li><a href="#">Ссылка</a></li>
  </ul>
  </li>
  <li>
  <a href="#">Файлы</a>
  <ul>
  <li><a href="#">Ссылка</a></li>
  <li><a href="#">Ссылка</a></li>
  <li><a href="#">Ссылка</a></li>
  <li><a href="#">Ссылка</a></li>
  <li><a href="#">Ссылка</a></li>
  <li><a href="#">Ссылка</a></li>
  </ul>
  </li>
</ul>

Ссылки заменяем на свои. Если вы не хотите использовать подменю, используйте структуру:

Code

<li><a href="#">Ссылка</a></li>

Обсудить

Добавил:Sezy |

Категория: Дизайн |

Дата: 16.07.2025 |

Просмотров: 17313 |

Комментариев: (23)

Звездочки для рейтинга

Создаём раздвижную форму поиска для uCoz

Аватар 150х150 от нашей дизайн студии

Радио по настроению

Статистика для системы ucoz

Пак нужных стильных иконок

Красивый Нет аватара. Подходящий для сайта со светлым дизайном.

Закругленное горизантольное меню на jQuery

Получить код кнопки или баннера

Новичкам. Border'ы в CSS

Всего комментариев: 6

Порядок вывода комментариев:

6 ladonnano4 (20.12.2016 13:04) [Материал]

Check my recent engagement
http://matrue.bbws.bigtitscam.webcam/?post.angela
delete porn easy kidz porn lil ranch porn reality submitted porn ass licking ffm categorize porn

5 leroyko69 (20.12.2016 10:02) [Материал]

Chit my new contract
http://bbw.girls.porngalleries.top/?entry.alysa
free mac friendly porn videos sex simpson porn porn secretes revealed justin slater porn iphone web porn

4 Beverlytaf (03.04.2014 03:18) [Материал]

Ванная келья уже давно стала незаменимым атрибутом цивилизованной жизни. И рукоделие тут не токмо в банальной гигиене, только и в возможности расслабиться, привести в порядок чувства и мысли. Вспомните, чистый часто затем тяжелого рабочего дня, придя восвояси, мы первым делом отправляемся в душ, и вместо запланированных 10 — 15 минут остаемся там для добрых пол часа.
http://vsy-mebel.ru/235-mebel-dlya-vannoj-60/ - Выбор мебели для ванной комнаты принужден ссылаться, заблаговременно только, на специфических функциях и небольших размерах обустраиваемого помещения. Невыносимо важно, чтобы всетаки предметы не занимали лишнего места, были удобны в использовании и не боялись повышенной влажности.

3 sergei2299 (08.06.2011 14:59) [Материал]

в какой блог встовлять именно???

2 sergei2299 (08.06.2011 14:58) [Материал]

я ничего не понел пожалуйсто объясните!!!

1 Николай (29.11.2010 10:53) [Материал]

Доброго дня суток!
Скрипт хороший, как раз то что мне нужно, только вот что мне прописать чтобы при переходе li был открыт на той же ссылке где была нажата ссылка?

Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

графика для сайтов | создание баннеров | создание шапки

Авторизация

Партнеры