Tilt.js - Лёгкий плагин анимации наклона
Десятки посетителей сайта спрашивали меня что за анимация картинок в кратких новостях? Как этот плагин называется? Что это такое? и тд и тп.
Скажу честно! Я до последнего держал эту штуку на 'чердаке' и не хотел делится :blush: так как скрипт придает хоть какую-то уникальность.
Но количество интересующихся данным скриптом людей достигло критической отметки, я не сдержался и решил выложить.
Плагин называется Tilt.js - Это лёгкий скрипт анимации наклона и 3D эффекта. Такую анимацию вы могли заметить на картинках в краткой новости этого сайта. У плагина куча конфигураций, эффектов и тд. Покажу как устанавливается и настраивается.
Скачиваем архив и распаковываем файл dest / tilt.jquery.js в папку с вашими js скриптами (если нет такой, создаем папку js и кидаем файл туда.)
Открываем файл index.html / main.tpl(для DLE шаблона) в самом конце перед </body> дописываем:
<script src="{THEME}/js/tilt.jquery.js"></script>
Как использовать?
Всё зависит от того как в вашем шаблоне выводятся изображения в новости. Например у меня отдельно выводится текст и картинка тегом
<img src="{image-1}">
Пример анимации как на сайте for-dle.ru:
<img src="{image-1}" alt="{title}" width="100%" data-tilt data-tilt-glare="true" data-tilt-transition="true" data-tilt-perspective="1000" data-tilt-scale="1">
О настройках я рассказывать не буду, это нудно и долго. Найти все настройки вы можете на странице автора.Вот как бы и всё!
Посетители, находящиеся в группе Гости, не могут оставлять комментарии к данной публикации.