Главная » Файлы » Прочие скрипты » jQuery |
Галерея изображений через плагин Zoomimage на jQuery
23.06.14, 11:38:58 | |
Очередной оригинальный плагин для увеличения изображений из серии lightbox Для начала посмотрите ДЕМО Установка: После /head на нужных страницах сайта вставляйте: Код <link rel="stylesheet" media="screen" type="text/css" href="/css/zoomimage.css" /> <script type="text/javascript" src="/js/eye.js"></script> <script type="text/javascript" src="/js/utils.js"></script> <script type="text/javascript" src="/js/zoomimage.js"></script> <script type="text/javascript" src="/js/layout.js"></script> Следующий код в то место, где будут располагаться сами картинки: 1) Для первого эффекта: Код <a href="Ссылка на большое изображение" title="Seashell" class="example1"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> <a href="Ссылка на большое изображение" title="Seashell" class="example1"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> <a href="Ссылка на большое изображение" title="Seashell" class="example1"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> <a href="Ссылка на большое изображение" title="Seashell" class="example1"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> <a href="Ссылка на большое изображение" title="Seashell" class="example1"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> 2) Для второго эффекта: Код <a href="Ссылка на большое изображение" title="Seashell" class="example2"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> <a href="Ссылка на большое изображение" title="Seashell" class="example2"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> <a href="Ссылка на большое изображение" title="Seashell" class="example2"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> <a href="Ссылка на большое изображение" title="Seashell" class="example2"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> <a href="Ссылка на большое изображение" title="Seashell" class="example2"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> 3) Для третьего эффекта: Код <a href="Ссылка на большое изображение" title="Seashell" class="example3"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> <a href="Ссылка на большое изображение" title="Seashell" class="example3"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> <a href="Ссылка на большое изображение" title="Seashell" class="example3"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> <a href="Ссылка на большое изображение" title="Seashell" class="example3"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> <a href="Ссылка на большое изображение" title="Seashell" class="example3"><img src="Ссылка на уменьшенное изображение" alt="Описание картинки" /></a> Осталось лишь залить четыре скрипта из прикреплённого архива в папку js стиль в папку css и все оставшиеся файлы в папку images Материал подготовленApocalypse | |
Просмотров: 392 | Загрузок: 0 | |
Всего комментариев: 0 | |
| |