| Главная » Файлы » Прочие скрипты » jQuery |
Увеличение изображений через плагин imgZoom с различными эффектами на jQuery для uCoz
| 23.06.14, 14:31:50 | |
 Данный плагин позволит осуществить увеличение ваших изображений с одним из трёх интересных эффектов Для начала посмотрите ДЕМО Установка: После /head на нужных страницах вставляйте: Код <link rel="stylesheet" type="text/css" media="screen" href="http://odyniec.net/projects/imgzoom/css/imgzoom.css" /> <script type="text/javascript" src="http://odyniec.net/projects/imgzoom/jquery.imgzoom.pack.js"></script> <script type="text/javascript"> $(function () { $('#img1').imgZoom({ showOverlay: true }); $('#img2').imgZoom({ showOverlay: true, opacity: 0 }); $('#img3').imgZoom({ showOverlay: true, rotate: true, duration: 1000 }); }); </script> Картинки оформляются следующим образом: 1) Эффект увеличения с затемнением фона: Код <a href="Ссылка на большое изображение"> <img id="img1" src="Ссылка на маленькое изображение" title="Zoom" /> </a> <a href="Ссылка на большое изображение"> <img id="img1" src="Ссылка на маленькое изображение" title="Zoom" /> </a> 2) Эффект плавного появления и угасания: Код <a href="Ссылка на большое изображение"> <img id="img2" src="Ссылка на маленькое изображение" title="Zoom" /> </a> <a href="Ссылка на большое изображение"> <img id="img2" src="Ссылка на маленькое изображение" title="Zoom" /> </a> 3) Эффект увеличения с вращением: Код <a href="Ссылка на большое изображение"> <img id="img3" src="Ссылка на маленькое изображение" title="Zoom" /> </a> <a href="Ссылка на большое изображение"> <img id="img3" src="Ссылка на маленькое изображение" title="Zoom" /> </a> В прикреплённом архиве находятся все файлы на тот случай, если ссылки на них станут битыми Материал подготовлен Apocalypse | |
| Просмотров: 346 | Загрузок: 0 | | |
| Всего комментариев: 0 | |
|
| |