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

Ещё один эффект увеличения пунктов меню через плагин Image Bubbles effect на jQuery
23.06.14, 08:17:20

Скачать файл




Ещё один интересный плагин увеличения с эффектом примагничичвания

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

Если демо устраивает - переходим к установке:

В head на нужных страницах вставляйте:
Код
<link href="/css/imgbubbles.css" rel="stylesheet" type="text/css" />


Далее после /head вставляйте следующий код:
Код
<script type="text/javascript" src="/js/imgbubbles.js"></script>  

  <script type="text/javascript">  
  jQuery(document).ready(function($){  
$('ul#squares').imgbubbles({factor:1.5}) //add bubbles effect to UL id="squares"  
  })  
  </script>


Обратите внимание на параметр factor:1.5 - это показатель того, во сколько раз будет увеличена картинка при наведении курсора. К примеру factor:1.5 указывает на увеличение в полтора раза, в то время как factor:2.5 будет указывать на увеличение в два с половиной раза...

Теперь код самого меню (Вставлять в нужное вам место):
Код
<ul id="squares" class="bubblewrap">  
  <li><a href="Ссылка на страницу"><img src="Ссылка на изображение" title="Описание ссылки" /></a></li>  
  <li><a href="Ссылка на страницу"><img src="Ссылка на изображение" title="Описание ссылки" /></a></li>  
  <li><a href="Ссылка на страницу"><img src="Ссылка на изображение" title="Описание ссылки" /></a></li>  
  <li><a href="Ссылка на страницу"><img src="Ссылка на изображение" title="Описание ссылки" /></a></li>  
  <li><a href="Ссылка на страницу"><img src="Ссылка на изображение" title="Описание ссылки" /></a></li>  
  <li><a href="Ссылка на страницу"><img src="Ссылка на изображение" title="Описание ссылки" /></a></li>  
  </ul>


Теперь нам остаётся лишь залить файлы из прикреплённого архива в соответствующие папки в вашем файловом менеджере:

imgbubbles.js - в папку js
imgbubbles.css - в папку css

Всё! материал подготовлен Apocalypse
Категория: jQuery | Добавил: Apocalypse | Теги: эффект, Ещё, Через, пунктов, увеличения, image, плагин, Один, Bubbles, Меню
Просмотров: 257 | Загрузок: 0 | Рейтинг: 0.0/0
Всего комментариев: 0
Имя *:
Email: