Боковое меню “Motion” для uCoz - Меню - UCOZ - Каталог файлов - Каморка
kamorka
Menu
Правила чата
Пользователи онлайн
Мини-чат
+Мини-чат
0
Онлайн всего: 1
Гостей: 1
Пользователей: 0
   Категории

Комментарии

KaMoRkA.uCoz.com -- uCoz -- Меню


С помощью возможностей JQuery мы можем превратить меню навигации в динамическое меню. Хотя сейчас для создания динамической навигации можно использовать только CSS3, JQuery делает меню еще более функциональным. Помимо динамических функций, дизайн также играет немаловажную роль. Хотя бы потому, что это то, что посетители видят в первую очередь, когда заходят на ваш сайт. Если меню будет непрезентабельным, это даст пользователям плохой опыт взаимодействия. Хороший дизайн меню в свою очередь увеличит качество вашего сайта, и даст лучший опыт взаимодействия пользователей.

Установка:

1. Между head и /head вставляете код:

Код
<script src="/js/menu.min.js"></script>


2. В папку CSS загружаем файл menusvg.css и вставляем следующий код в верхнюю часть сайта :

Код
<link type="text/css" rel="StyleSheet" href="/css/menusvg.css" />


3. Загружаем все файлы из папки JS в папку JS у себя на сайте.


4. Код меню в нижнюю часть сайта перед /body вставляете код меню:

Код
<div class="menu">  
  <div class="menu-bg js-blur"></div>  
  <nav class="menu-items">  
   
  <a href="#" class="menu-item">  
  <span class="js-blur">uCoz.Ru</span>  
  </a>  
   
  <a href="#" class="menu-item">  
  <span class="js-blur">uKit.Com</span>  
  </a>  
   
  <a href="#" class="menu-item">  
  <span class="js-blur">Yraaa.Ru</span>  
  </a>  
   
  <a href="#" class="menu-item">  
  <span class="js-blur">uGarts.Pro</span>  
  </a>  
   
  <a href="#" class="menu-item">  
  <span class="js-blur">ZorNet.Ru</span>  
  </a>  
   
  </nav>  
  </div>  
  <button class="menu-toggle"><span>Меню</span></button>  
  </div>


5. Там же в нижней части сайта перед /body вставляете код:

Код
<script src="/js/motionblur.js"></script>  
  <script src="/js/menu.js"></script>

Важно!

При копировании материала указывать ссылку на источник.

- 398
- 02-Июля-2017
- 0
Материал разместил:

Похожий материал
Статьи сайта