Error get alias
Максим Постников
Сообщить об ошибке

Эффект 3D-карточек при наведении

Добавляет эффект 3D-поворота карточек в Zero-блоке с настраиваемой анимацией

Инструкция по установке

  • Cкопируйте код ниже и вставьте его внутрь <head> в настройках сайта
    Этот скрипт устанавливается только один раз и помогает модификациям работать. Если он уже стоит у вас на сайте, добавлять его снова не нужно, просто пропустите этот шаг.
<script src="https://cdn.postnikovmd.com/tilda@1.4/mods.min.js"></script>
Скопировать код
Код скопирован!
Синхронизация обновлений включена. Новые версии и исправления будут устанавливаться автоматически.
Синхронизация обновлений отключена. Текущая версия останется неизменной, независимо от обновлений.
  • Создайте Zero-блок и добавьте в него карточки, для которых будет применён эффект
  • Объедините элементы карточек в группы с типом Object и задайте каждой из них класс .uc-tilt
    Если вы планируете использовать на странице несколько блоков с таким эффектом, задайте карточкам в каждом блоке разные классы, например, .uc-tilt1, .uc-tilt2 и т. д.
  • Задайте в настройках модификации класс карточек и параметры их анимации
  • Скопируйте код и вставьте его в блок T123 в конец страницы
Как это сделано?
<script>tilt.init(".uc-tilt", { glare: true, rotate: 5 })</script>
Открыть пример
Настройки модификации

Настройки модификации

Класс карточек:
Блики при повороте:
Скорость поворота:
Макс. угол поворота:
Если включить, при повороте края карточек будут становиться светлее
Чем больше значение, тем сильнее вращается карточка
<!--tilt.js Эффект 3D-поворота карточек. https://postnikovmd.com/mods/tilt-->
<script>tilt.init(".uc-tilt")</script>
Скопировать код
Скопировать код
Код скопирован!

Документация

Параметры

Если при установке что-то пошло не так

Добавьте параметр ?showerrors в конец ссылки, чтобы увидеть ошибки и рекомендации по их исправлению
Попробовать
Чат для дизайнеров
«Вместе всё получится»
3 000+ человек
t.me/postnikovmd
Присоединяйтесь к авторскому Telegram-каналу!
Всё о возможностях библиотеки, новых модификациях и тех. поддержке
Понравились модификации?
Можете отправить любую сумму, чтобы поблагодарить автора за работу. Вам плюсик в карму, а мне приятно!
Чат для дизайнеров
«Вместе всё получится»
3 000+ человек
t.me/postnikovmd
Присоединяйтесь к авторскому Telegram-каналу!
Всё о возможностях библиотеки, новых модификациях и тех. поддержке
 
Поделитесь впечатлениями
Нравятся модификации?
Расскажите про опыт ваш работы с модификациями — обратная связь поможет сделать их лучше
Расскажите про ваш опыт работы с ними — обратная связь поможет сделать их лучше
Отправить
Сообщение отправлено
Спасибо, что делитесь с нами! Это помогает нам развиваться и улучшать сервис
Вернуться назад