[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Форум » РАЗНОЕ » МОДЕРНИЗАЦИЯ САЙТОВ » Горизонтальное меню
Горизонтальное меню
KINGxNIGHTДата: Понедельник, 31.08.2009, 15:03 | Сообщение # 1
Admin
Группа: Администраторы
Сообщений: 945
Репутация:
« 0 »
Статус:
♂
ВЫПАДАЮЩЕЕ МЕНЮ!

Способ установки:
1. Содержимое архива Vupadaysheye meny.rar(папки img и css вместе с содержимым) залеваем в корень сайта
2. Этот код вставляем после head в шаблон - страницы сайта

Code
<link rel="stylesheet" type="text/css" href="/css/Meny.css" />

3. Создаете глобальный блок MENY туда вписываете это:

Code
<span class="preload1"></span>           
<span class="preload2"></span>

                     
<ul id="nav">           
<li class="top"><a href="Ссылка" class="top_link"><span>Пример</span></a></li>           
<li class="top"><a href="Ссылка" id="products" class="top_link"><span class="down">Пример</span></a>           
<ul class="sub">           
<li><a href="Ссылка" class="fly">Пример</a>           
<ul>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
</ul>           
</li>           
<li class="mid"><a href="Ссылка" class="fly">Пример</a>           
<ul>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка" class="fly">Пример</a>           
<ul>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
</ul>           
</li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка" class="fly">Пример</a>           
<ul>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
</ul>           
</li>           
</ul>           
</li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
</ul>           
</li>           
<li class="top"><a href="Ссылка" id="services" class="top_link"><span class="down">Пример</span></a>           
<ul class="sub">           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
</ul>           
</li>           
<li class="top"><a href="Ссылка" id="contacts" class="top_link"><span class="down">Пример</span></a>           
<ul class="sub">           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка" class="fly">Пример</a>           
<ul>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка" class="fly">Пример</a>           
<ul>           
<li><a href="Ссылка" class="fly">Пример</a>           
<ul>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка" class="fly">Пример</a>           
<ul>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
</ul>           
</li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
</ul>           
</li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
</ul>           
</li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
</ul>           
</li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
</ul>           
</li>           
<li class="top"><a href="Ссылка" id="shop" class="top_link"><span class="down">Пример</span></a>           
<ul class="sub">           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
<li><a href="Ссылка">Пример</a></li>           
</ul>           
</li>           
<li class="top"><a href="Ссылка" id="privacy" class="top_link"><span>Пример</span></a></li>           
</ul>

ссылка и пример в коде меняешь на свое!!!

4. ставишь код созданного глобального меню куда те надо в шаблоне -под шапку

Файлы:

Прикрепления: 8364610.rar (8.6 Kb)
 
KINGxNIGHTДата: Четверг, 03.09.2009, 16:46 | Сообщение # 2
Admin
Группа: Администраторы
Сообщений: 945
Репутация:
« 0 »
Статус:
♂
[info]еще одно меню[/info]

1) Качаем архив и выбираем понравившеюся цверовую схему и загружаем в корень сайта.
2) Вставляем между тегами head и /head вот этот скрипт и вставляем там ссылки на картинки.

Code
<style type="text/css">
/*Credits: By Santosh Setty*/
/*Posted to: Dynamic Drive CSS Library*/

.glossymenu{
position: relative;
padding: 0 0 0 34px;
margin: 0 auto 0 auto;
background: url(путь к картинке заднего фона) repeat-x; /*путь к картинке заднего фона*/
height: 46px;
list-style: none;
}

.glossymenu li{
float:left;
}

.glossymenu li a{
float: left;
display: block;
color:#000;
text-decoration: none;
font-family: sans-serif;
font-size: 13px;
font-weight: bold;
padding:0 0 0 16px; /*Padding to accomodate left tab image. Do not change*/
height: 46px;
line-height: 46px;
text-align: center;
cursor: pointer;
}

.glossymenu li a b{
float: left;
display: block;
padding: 0 24px 0 8px; /*Расстояние между элементами меню*/
}

.glossymenu li.current a, .glossymenu li a:hover{
color: #fff;
background: url(путь к левой картинке) no-repeat; /*путь к левой картинке*/
background-position: left;
}

.glossymenu li.current a b, .glossymenu li a:hover b{
color: #fff;
background: url(путь к правой картинке) no-repeat right top; /*путь к правой картинке*/
}</style>

3) Теперь вставляем в нужное место само меню:

Code
<ul class="glossymenu">
<li class="current"><a href="http://Ссылка"><b>Название</b></a></li>
<li><a href="http://Ссылка"><b>Название</b></a></li>
<li><a href="http://Ссылка"><b>Название</b></a></li>
<li><a href="http://Ссылка"><b>Название</b></a></li>
<li><a href="http://Ссылка"><b>Название</b></a></li>
<li><a href="http://Ссылка"><b>Название</b></a></li>
</ul>
Прикрепления: images.zip (15.8 Kb)
 
SkazkaДата: Пятница, 11.09.2009, 22:23 | Сообщение # 3
Полковник
Группа: Проверенные
Сообщений: 152
Репутация:
« 6 »
Замечания: 0%
Статус:
♀
хочется такое,,но как-то сложно,,
 
MustangДата: Суббота, 17.10.2009, 09:47 | Сообщение # 4
Лейтенант
Группа: Пользователи
Сообщений: 42
Репутация:
« 0 »
Замечания: 0%
Статус:
♂
ага, както сильно много функцый нада сделать, сделаю попоже
 
Форум » РАЗНОЕ » МОДЕРНИЗАЦИЯ САЙТОВ » Горизонтальное меню
  • Страница 1 из 1
  • 1
Поиск:
Статистика Форума
Последние темы(сообщения) форума Самые популярные темы Лучшие пользователи Новые пользователи
  • ОБРУГАЙ СТОЛБ-STANISLAV!!! (12)
    19.02.2024,[Pruinajg]
  • Бойтесь меня!!!!! (52)
    22.09.2023,[Pruinajg]
  • Разборки участников! (199)
    17.02.2017,[MSCEl]
  • ПИРАТЫ, ЗА и ПРОТИВ (10)
    16.02.2017,[Donaldnal]
  • прикольные фотки из underground 2 (1)
    13.02.2017,[MSCEl]
    		•
  • Половина слова (449)
  • Хоббиты UNDERGROUND-2 (259)
  • Разборки участников! (199)
  • Рекорды дрифта (141)
  • Загадай фотографию (130)
    		•
  • KINGxNIGHT
    • Посты:( 945 )
  • MILA
    • Посты:( 288 )
  • Boomer
    • Посты:( 162 )
  • Skazka
    • Посты:( 152 )
  • NFSU2_king
    • Посты:( 133 )
  • Pruinajg
    • [03.02.2023]
  • LinaSap
    • [30.01.2023]
  • travismArrak
    • [12.01.2023]
  • ippudraArrak
    • [12.01.2023]
  • Marusechkajeoni
    • [02.01.2023]


    ЧАТ
    Сообщения
    Copyright MyCorp © 2024