Главная » Файлы » Прочие скрипты » jQuery

Вертикальное многоуровневое меню, плавно летающее за курсором на jQuery 1.4
23.06.14, 13:40:34

Скачать файл




Оригинальне меню, которое будет плавно скользить за вашим курсором

Для начала посмотрите ДЕМО

Установка:

После /head на нужных страницах вставляйте:
Код
<link href="/css/malihu.cfm.css" rel="stylesheet" type="text/css" />
  <script type="text/javascript" src="/js/jquery.min.js"></script>
  <script type="text/javascript" src="/js/jquery.easing.1.3.js"></script>


Следующий код вставляйте сразу после предыдущего:
Код
<div id="cf_menu">
<div class="container">
<div class="title">MENU</div>
<ul>
<li><a href="#" onclick="Animate2id('#home');return false">↑ Home</a></li>
<li><a href="#" onclick="Animate2id('#about');return false">About me</a></li>
<li><a href="work">+ Work</a>
<ul>
<li><a href="#" onclick="Animate2id('#recent');return false">Recent</a></li>
<li><a href="#" onclick="Animate2id('#web');return false">Web</a></li>
<li><a href="#" onclick="Animate2id('#print');return false">Print</a></li>
</ul>
</li>
<li><a href="#" onclick="Animate2id('#blog');return false">Blog</a></li>
<li><a href="links">+ Interesting links</a>
<ul>
<li><a href="#" onclick="Animate2id('#freebies');return false">Freebies & Resources</a></li>
<li><a href="#" onclick="Animate2id('#people');return false">People</a></li>
</ul>
</li>
<li><a href="#" onclick="Animate2id('#contact');return false">Contact</a></li>
<li><a href="info">+ Script info</a>
<ul>
<li><a href="#">See the post</a></li>
<li><a href="#">↓ Download</a></li>
</ul>
</li>
<li><a href="#">malihu</a></li>
</ul>
</div>
  </div>


Все пункты меню, конечно же, меняйте на свои

Следующий код вставляйте в самый низ нужных страниц после тега /body или же сразу после предыдущего кода:
Код
<script>
  //cursor following menu config  
  $mouseover_title="+ MENU"; //menu title text on mouse-over  
  $mouseout_title="MENU"; //menu title text on mouse-out  
  $menu_following_speed=2000; //the speed in which the menu follows the cursor (in milliseconds)  
  $menu_following_easing="easeOutCirc";
  $menu_cursor_space=30; //space between cursor and menu  
  $menu_show_speed="slow"; //menu open animation speed  
  $menu_show_easing="easeOutExpo"; //menu open animation easing type  
  $menu_hide_speed="slow"; //menu close animation speed  
  $menu_hide_easing="easeInExpo"; //menu close animation easing type  
  </script>
  <script src="/js/malihu.jquery.cfm.js"></script>


Осталось лишь залить три скрипта из прикреплённого архива в папку js и стиль в папку css

Материал подготовлен Apocalypse
Категория: jQuery | Добавил: Apocalypse | Теги: вертикальное, Плавно, курсором, на, летающее, JQuery, Меню, 1.4, За, Многоуровневое
Просмотров: 277 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email: