Приветствую Вас Прохожий | RSS Четверг, 08.12.2016, 05:04
Меню сайта
ВИДЕО УРОКИ СКРИПТЫ UCOZ ШАБЛОНЫ UCOZ ФОТОШОП UCOZ КАТАЛОГ СТАТЕЙ ВЕБМАСТЕРУ UCOZ ВИДЕО ФОТОШОПА ДОПОЛНЕНИЕ САЙТА РАЗДЕЛ СТУДИИ УСЛУГИ НАШЕГО САЙТА


Мини-чат
Все вопросы задаем в форуме,
здесь они игнорируются!



Статистика
Онлайн всего: 4
Гостей: 2
Пользователей: 2
alexman91, LESIYI



Главная » Файлы » Скрипты для uCoz » Скрипты Разное

Горизонтальное меню с помощью JavaScript & jQuery

Горизонтальное меню с помощью JavaScript & jQuery - Еще один красивый меню, для вашего сайта, и с помощью JavaScript. Он позволяет крутить ссылки а jQuery помогать в эффектах для него. В общем меню состоит из 4 вкладок, в которых есть "подменю" и для того что бы добавить еще вкладок, нужно все изменить в CSS, думаю сами разберетесь.
Цвет меню можно изменить в CSS.
Количество ссылок не ограничено.
Все другие функции можно изменить только в JS файле....


Вставьте все коды, так как указанной!
Можете посмотреть глазиком на меню, в демо странице сайта

Установка: Вставьте первый данный код в ваш CSS
Code
  
#page-wrap{ width: 720px; margin: 25px auto; }  
p{ margin: 0 0 8px 0; }
a{ text-decoration: none; }
img{ vertical-align: middle; }
a img{ border: 0; 180}
ul{ list-style: none; }
h1{ margin: 0 0 10px 0; }
ul.dropdown{ position: relative; width: 100%; }
ul.dropdown li{ font-weight: bold; float: left; width: 180px; background: #778899; position: relative; }
ul.dropdown a:hover{ color: #fff; }
ul.dropdown li a{ display: block; padding: 20px 8px; color: #fff; position: relative; z-index: 2000; }
ul.dropdown li a:hover,ul.dropdown li a.hover { background: #369; position: relative; }
ul.dropdown ul{ display: none; position: absolute; top: 0; left: 0; width: 180px; z-index: 1000; }
ul.dropdown ul li{ font-weight: normal; background: #778899; color: #fff; border-bottom: 1px solid #fff; }
ul.dropdown ul li a{ display: block; background: #778899 !important; }  
ul.dropdown ul li a:hover{ display: block; background: #369 !important; }

А это уже JS файлы, их нужно вставлять где нить ближе к самому меню, лучше вставьте сразу с меню, вот так:
Code
<script type="text/javascript" src="http://test-ucozon.do.am/files/mirmenu1.js"></script>  
<script type="text/javascript" src="http://test-ucozon.do.am/files/mirmenu2.js"></script>  

<div id="page-wrap">
<ul class="dropdown">
  <li><a href="">Галерея</a>
  <ul class="sub_menu">
  <li><a href="">Видео</a></li>
  <li><a href="">Музыка</a></li>
  <li><a href="">Картинки</a></li>
  <li><a href="">Названия 1</a></li>
  <li><a href="">Названия 2</a></li>
  <li><a href="">Названия 3</a></li>
  <li><a href="">Названия 4</a></li>
  <li><a href="">Названия 5</a></li>
  <li><a href="">Названия 6</a></li>
  <li><a href="">Названия 7</a></li>
  <li><a href="">Названия 8</a></li>
  <li><a href="">Названия 9</a></li>
  <li><a href="">Названия 10</a></li>
  <li><a href="">Названия 11</a></li>
  <li><a href="">Названия 12</a></li>
  <li><a href="">Названия 13</a></li>
  <li><a href="">Названия 14</a></li>
  <li><a href="">Названия 15</a></li>
  <li><a href="">Названия 16</a></li>
  <li><a href="">Названия 17</a></li>
  <li><a href="">Названия 18</a></li>
  <li><a href="">Названия 19</a></li>
  <li><a href="">Названия 20</a></li>
  <li><a href="">Названия 21</a></li>
  <li><a href="">Названия 22</a></li>
  <li><a href="">Названия 23</a></li>
  <li><a href="">Названия 24</a></li>
  <li><a href="">Названия 25</a></li>
  <li><a href="">Названия 26</a></li>
  <li><a href="">Названия 27</a></li>
  <li><a href="">Названия 28</a></li>
  <li><a href="">Названия 29</a></li>
  <li><a href="">Названия 30</a></li>
  </ul>
  </li>
  <li><a href="">Форум</a>
  <ul class="sub_menu">
  <li><a href="">Наш сайт</a></li>
  <li><a href="">Веб мастеру</a></li>
  <li><a href="">Любовь и Секс</a></li>
  <li><a href="">Конкурсы от сайта</a></li>
  <li><a href="">Форум пост 1</a></li>
  <li><a href="">Форум пост 2</a></li>
  <li><a href="">Форум пост 3</a></li>
  <li><a href="">Форум пост 4</a></li>
  <li><a href="">Форум пост 5</a></li>
  <li><a href="">Форум пост 6</a></li>
  <li><a href="">Форум пост 7</a></li>
  <li><a href="">Форум пост 1</a></li>
  </ul>
  </li>
  <li><a href="">Игры</a>
  <ul class="sub_menu">
  <li><a href="">Категория 1</a></li>
  <li><a href="">Категория 2</a></li>
  <li><a href="">Категория 3</a></li>
  <li><a href="">Категория 4</a></li>
  <li><a href="">Категория 5</a></li>
  </ul>
  </li>
  <li><a href="">О сайте</a>
  </li>
  </ul>

</div>

Данный код, нужно вставить туда, где хотите что бы он был :)


Автор: Не известен

Модернизировал: мир_младший
Сайт: http://ucozon.ru


В архиве стоит демо html файл, и не обязателен для скачивание !!!
Автор\Источник: ruseller.com

Для того что бы скачать архив необходимо зайти на сайт как пользователь.
Просмотров: 1926 | Комментарии: 8 | Рейтинг: 4.2/5 | |Категория: Скрипты Разное | Добавил: STAFF | Дата: 09.08.2011 | Скачали: 4
Похожие новости на нашем сайте
  • Анка ткани

    Ткани Anka в интернет-магазине! Удобная доставка! Швейный цех. Заходи

    xdecor.ru

Коментарий к новости

Всего комментариев: 8
8 STAFF   Дата: 12.08.2011  Время: 01:39   [№ 9976]
И в ответ тишина...

6 Fallen™   Дата: 11.08.2011  Время: 23:50   [№ 9974]
извените конечна,но зачем для такого меню JavaScript & jQuery???
такое меню на css пишется легко!!!!

7 STAFF   Дата: 11.08.2011  Время: 23:57   1 [№ 9975]
1. Я не автор
2. Но мне очень любопытно как вы с помощью css сделайте такой же...

5 wufer   Дата: 10.08.2011  Время: 00:25   [№ 9947]
а как с индексацией у этого меню, всё в порядке?

4 STAFF   Дата: 09.08.2011  Время: 22:58   [№ 9946]
Вот мне интересно, куда скрин дели ))

-1   Спам
1 Elik54245424   Дата: 09.08.2011  Время: 21:14   [№ 9939]
Можно скрин с примером?

+2   Спам
2 MrTiko   Дата: 09.08.2011  Время: 21:25   1 [№ 9942]
пример есть а скрин ненужно пример классный

+1   Спам
3 Elik54245424   Дата: 09.08.2011  Время: 22:23   2 [№ 9945]
Упс точно =_) Я просто пример не заметил


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

Форма входа
Логин:
Пароль:


Поиск


На форуме

1 Файловик. Уникальные те...

0

2 Куплю сайты в индексе Я...

1

3 Куплю сайты с ТИЦ/PR (п...

9

4 Предлагаю услуги для ан...

0

5 Предлагаю услуги по про...

0

6 Комплексный прогон сайт...

51

7 Сайт онлайн фильмов на ...

1

8 Проблема с таблицей

9

9 Отредактировать фото

2

10 Уже все перепробовал )

1


Подробней о форуме


Комментарии



Copyright UcozOn.ru™ © 2008-2016


Кнопка 88х31 сайта ucozon.ru