Скрипт эффекта лупы
|
|
Размер: 34,1 Мб. Длительность: 14 мин. 36 сек. |
В этом видео мы рассмотрим полезный и простой в настройке скрипт, позволяющий добиться интересного эффекта рассматривания изображения под увеличительным стеклом.
Для работы скрипта нужна библиотека jQuery, а сам скрипт называется Zoomy.
Довольно часто может возникнуть необходимость дать посетителю сайта возможность рассмотреть то или иное изображение в деталях, в увеличенном виде.
Наиболее очевидные сферы применения данного скрипта - фотогалереи и интернет-магазины, когда потенциальный покупатель может рассмотреть товар в деталях.
Разумеется, для реализации этой возможности потребуется 2 изображения одного и того же объекта. Одно изображение будет отображаться изначально, другое же предназначено для показа "увеличенного" изображения под лупой.
Скрипт очень прост в настройке и позволяет:
- регулировать диаметр увеличительного стекла;
- выбирать его форму (круглое или квадратное);
- добавлять своеобразный глянец-блик около внешней грани лупы;
- настраивать саму окантовку лупы (цвет, толщина);
- указывать событие мыши, на которое будет реагировать скрипт (клик, наведение курсора мыши)
В целом скрипт оставляет приятное впечатление, работает гладко, без задержек и даже добавляет некоторый шарм в процесс просмотра изображений.
Вы можете просмотреть этот урок прямо сейчас, либо скачать его себе на компьютер по ссылке выше.
P.S. Присмотритесь к премиум-урокам по различным аспектам сайтостроения, включая JavaScript, jQuery и Ajax, а также к бесплатному курсу по созданию своей CMS-системы на PHP с нуля. Все это поможет вам быстрее и проще освоить практические навыки веб-программирования:
Понравился материал и хотите отблагодарить?
Просто поделитесь с друзьями и коллегами!
Смотрите также:
|
|
50 классных сервисов, программ и сайтов для веб-разработчиков |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
