ZooMove jQuery Plug-in за увеличаване на изображенията при Hover
Ако някога сте разглеждали уебсайт за електронна търговия, вероятно сте виждали ефект на мащабиране на изображението. Задръжте снимка на продукта и тази част от изображението се увеличава за a по-ясна представа.
Най- ZooMove плъгин е чудесен начин повторете този ефект на сайта си. е задвижвани от jQuery, така че можете да получите това и да стартирате бързо без много код.
ZooMove е напълно свободен и с отворен код в GitHub за любопитни разработчици. Тя може да бъде инсталирана чрез NPM, беседка, прежда, или изтеглени директно от CDNJS.
За да настроите ZooMove изображение, ще ви трябва три конкретни файла в заглавката на страницата ви:
- JQuery
- ZooMove CSS
- ZooMove JS
И двата ZooMove файла може да бъде намалена ако искате по-бързо зареждане на страници. Можете също така да комбинирате CSS файла с основния стил, ако това е по-лесно.
Цялата истинска магия се случва в HTML, където можете задайте HTML5 данни- * атрибути
за различните ефекти.
Това ви позволява да създадете своя свой собствен ефект на мащабиране въз основа на четири различни параметъра:
данни зоопарк мащаб
- определя общ размер на мащаба при придвижване (напр. 2.0 за 200%)данни зоопарк-ход
- определя дали изображението се движи заедно с курсораданни зоопарк-предавателен
- определя увеличеното изображение над оригиналаданни зоопарк-курсор
- определя точка на курсора
Последният пети параметър ви позволява да определите какво нов URL адрес на изображение трябва да бъде (ако е необходимо).
Можете да използвате ZooMove във всички основни браузъри, включително IE9 +. Този плъгин е широко подкрепяно и предлага едно усещане за потребителски опит.
Ако търсите за проста библиотека за навигиране към мащабиране ZooMove е отличен избор. е достатъчно лек да се изпълнява на всеки уебсайт и това е задвижвани от jQuery, така че няма да ви се налага да пишете толкова код, че да работи.
Посетете главната страница, за да я видите в действие и вижте документацията на GitHub, за да научите повече.