Ваша корзина пуста
Форма входа

Бесплатный раздел

Вы здесь: Главная страница » Файлы » Переключатели / Навигация
Уважаемые пользователи!
Доводим до вашего сведения, что мы не занимаемся обучениями по системе uCoz и настройками Ваших сайтов.
Подобные просьбы и вопросы - будут игнорироваться!

MiniMenu: крошечное дополнение к меню

Дата добавления: 25.05.2017 - 00:34
Добавил: Buger
Количество просмотров: 1.9k
Количество комментариев: 0
Размер файла: 15.2 Kb
Рейтинг материала: 5.0 / 1
MiniMenu: крошечное дополнение к меню
БЕСПЛАТНО
Скачать файл с сервера
рейтинг 5.0
/
голосов 1
MiniMenu может добавить крошечную, но уникальную навигацию на ваш сайт. В зависимости от ваших потребностей оно может выполнять роль основного и вспомогательного меню и подходит для использования как на рабочем столе, так и на мобильном устройстве (где оно привязывается к полноэкранному режиму, чтобы в полной мере использовать пространство экрана).

С простыми знаниями кодирования вы, конечно, можете расширить и изменить его так, как сочтете нужным.

Работу данного MiniMenu вы сможете посмотреть в демонстрации

Установка:
Загрузить папку /minimenu/ в файловый менеджер сайта, включая папки /css/, /js/, /fonts/, вместе с их содержимым.

Подключить скрипты и стили
Код
<link rel="stylesheet" href="/minimenu/css/minimenu.css" type="text/css" media="all" />
<script src="/minimenu/js/jquery.scrollbar.min.js" type="text/javascript"></script>
<script src="/minimenu/js/minimenu.js" type="text/javascript"></script>


HTML разметка:
Код
<!-- BEGIN MENU BUTTON -->
  <div class="minimenu-menu-button-wrapper">
  <div class="minimenu-menu-tooltip"></div>
  <div class="minimenu-menu-button-wrapper-inner">
  <div class="minimenu-menu-button"></div>
  <div class="minimenu-menu-button-middle"></div>
  </div>
  <div class="minimenu-menu-button-text-wrapper">
  <div class="minimenu-menu-button-text">Browse</div>
  </div>
  </div>
  <!-- END MENU BUTTON -->

  <!-- BEGIN MENU + SOCIAL BAR -->
  <div class="minimenu-by-bonfire-wrapper">

  <!-- BEGIN MENU -->
  <div class="minimenu-close-button"></div>
  <div class="minimenu-by-bonfire">
  <div class="minimenu-by-bonfire-inner">
  <div class="menu-minimenu-menu-container">
  <!-- BEGIN MENU ITEMS -->
  <ul>
  <li><a href="#">Purchase MiniMenu</a>
  <div class="minimenu-menu-item-description">This is a menu item description.</div>
  </li>
  <li class="menu-item-has-children"><a href="#">PC Enthusiast</a>
  <ul class="sub-menu">
  <li><a href="#">Pre-built</a> | </li>
  <li class="menu-item-has-children"><a href="#">By component:</a>
  <ul class="sub-menu">
  <li><a href="#">CPU</a>,</li>
  <li><a href="#">GPU</a>,</li>
  <li><a href="#">Motherboard</a> | </li>
  </ul>
  </li>
  <li><a href="#">New tech</a></li>
  </ul>
  </li>
  <li><a href="#">Solo menu item</a></li>
  <li><a href="#">Another menu item</a></li>
  </ul>
  <!-- END MENU ITEMS -->
  </div>
  <img style="width:100%;" src="http://art-ucoz.ru/files/Navigation/3/lcgo.jpg">
  </div>
  </div>
  <!-- END MENU -->

  <!-- BEGIN SOCIAL -->
  <div class="minimenu-social-bar-wrapper">
  <div class="minimenu-social-bar-label">SOCIAL:</div>
  <div class="minimenu-social-bar-icons">
  <a href="#">
  <span class="minimenu-icon-youtube"></span>
  </a>
  <a href="#">
  <span class="minimenu-icon-twitter"></span>
  </a>
  <a href="#">
  <span class="minimenu-icon-facebook"></span>
  </a>
  <a href="#">
  <span class="minimenu-icon-instagram"></span>
  </a>
  <a href="#">
  <span class="minimenu-icon-google-plus"></span>
  </a>
  </div>
  </div>
  <!-- END SOCIAL -->
  </div>
  <!-- BEGIN MENU + SOCIAL BAR -->

  <!-- BEGIN BACKGROUND OVERLAY -->
  <div class="minimenu-overlay"></div>
  <!-- END BACKGROUND OVERLAY -->


Источник: http://art-ucoz.ru/
Добавлять комментарии могут только зарегистрированные пользователи.


Поделись с друзьями: