Главная » Файлы » Прочие скрипты » 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 | |
Просмотров: 371 | Загрузок: 0 | |
Всего комментариев: 0 | |
| |