Добавьте эффект увеличения на веб-сайт с помощью jfMagnify

Есть много бесплатных плагинов, которые работают невероятно хорошо. Тем не менее, большинство из них построены для изображений, и они указывают направления для контента только для изображений.

Что если бы вы могли добавить эффект увеличения к каждой части вашей веб-страницы? Благодаря jfMagnify, вы можете.

Это бесплатный плагин jQuery, который поддерживает не только масштабирование изображения, но и масштабирование всей страницы. Это один из немногих плагинов, который также позволяет вам выбирать уровень увеличения и поддерживает сенсорные события для мобильных пользователей.

Программы для Windows, мобильные приложения, игры - ВСЁ БЕСПЛАТНО, в нашем закрытом телеграмм канале - Подписывайтесь:)

Читайте также: Как увеличить изображения, как средний

Обратите внимание, что этот плагин может показаться немного тяжелым, потому что он опирается на две зависимости: обычный jQuery и jQuery UI. Они оба необходимы для правильной работы jfMagnify. Не говоря уже о самом скрипте jfMagnify, который вам нужно будет добавить на свою страницу.

Установка немного сложна, потому что вы можете ориентироваться только на увеличенные элементы в контейнере. Если вы хотите настроить таргетинг на всю страницу, вам нужно включить класс на весь сайт.

Вот как будет выглядеть одна строка jQuery:

$ ( “Возвеличивать”) jfMagnify ().

Это предназначается для всех элементов в контейнере .magnify, который обычно является элементом div.

Эти внутренние элементы могут быть изображениями, но могут также включать мелкий шрифт, например, на страницах условий сайта или политики конфиденциальности. Вся документация доступна в GitHub репопоэтому, как только вы настроите его, весь процесс станет намного проще.

Кроме того, этот плагин очень изменчив и поставляется с множеством контейнерных правил. Например, элемент контейнера не может иметь статическую позицию CSS, поэтому он должен быть относительным, абсолютным или фиксированным.

Вы можете найти все правила стиля по умолчанию в репозитории GitHub, но это может быть затруднительно, если ваш макет уже создан и работает. Преимущества jfMagnify, на мой взгляд, стоят усилий. Действительно, это зависит от ваших потребностей и от того, нравится ли вам интерфейс.

Взгляните на документы на GitHub чтобы увидеть, что вы думаете. И вы также можете просмотреть интерфейс на CodePen если вы хотите увидеть библиотеку в действии перед ее установкой.

Увидеть перо Масштаб jfMagnify Джон Фанесток (@fonstok)
на CodePen,

Читайте также: Как создать чистый CSS onClick Image Zoom Effect