| Главная » Файлы » Прочие скрипты » jQuery |
Интересный плагин Image Zoomer с возможностью увеличения изображения до 10x (Доработано Apocalypse) на jQuery
| 23.06.14, 08:22:32 | |
 Неплохой плагин для просмотра увеличенного варианта картинки с возможностью увеличения до 10x простым вращением колёсика мышки Для начала посмотрите ДЕМО Переходим к установке: После /head на нужных вам страницах вставляйте: Код <style type="text/css"> .magnifyarea{ /* CSS to add shadow to magnified image. Optional */ box-shadow: 5px 5px 7px #818181; -webkit-box-shadow: 5px 5px 7px #818181; -moz-box-shadow: 5px 5px 7px #818181; filter: progid:DXImageTransform.Microsoft.dropShadow(color=#818181, offX=5, offY=5, positive=true); background: white; } </style> <script type="text/javascript" src="/js/featuredimagezoomer.js"></script> <script type="text/javascript"> jQuery(document).ready(function($){ $('img[class=zoom]').addimagezoom({ zoomrange: [1, 10]}) }) </script> Всё, настройка скрипта закончена. Осталось лишь прописать картинки, которые можно будет увеличивать: Код <img class="zoom" border="0" src="Ссылка на картинку" style="width:300px;" /> <img class="zoom" border="0" src="Ссылка на картинку" style="width:300px;" /> Теперь залейте скрипт из архива в папку js Как можете увидеть, достаточно лишь приписать к картинке класс zoom и задать её необходимый размер, чтобы плагин начал обрабатывать изображение Данный скрипт полностью переписан Apocalypse, так как в оригинальной версии необходимо было прописывать ссылки на полные изображения и отдельные настройки для каждой картинки. Я избавил вас от данного неудобства Материал подготовлен Apocalypse | |
| Просмотров: 381 | Загрузок: 0 | | |
| Всего комментариев: 0 | |
|
| |