Сейчас узнаем, какой подарок выпадет именно Вам
Крутите колесо
Ура, вы выиграли!
Ваш приз:
Годовой доступ
к видео на mo-ti -20%
по промокоду T19RAY
Промокод действителен 3 дня

Оформить доступ с промокодом
100
#2470a1
 
Watch latest movies and glamour news in one app.
1 Editors' Choice Of 2018
Phosfluorescently re-engineer open-source manufactured products vis-a-vis an expanded array of potentialities.
Get It From
App Store
Get It From
Play Store

Делаем эффект вращения при наведении на фото в ZeroBlock в Tilda

Как создали данный пример?
1. Создали ZeroBlock и добавили в него фото с классом parcon
2. Добавили скрипт на страницу
Код добавляется в блок ДРУГОЕ►Т123
Настройки вращения по осям производим в строке

transform: translateX(10px) translateY(-14px) translateZ(60px) scaleX(1) scaleY(1) scaleZ(2) rotateX(40deg) rotateY(-3deg) rotateZ(-34deg) skewX(-5deg) skewY(6deg);

<style>
.parcon  .tn-atom {
  -webkit-perspective: 1200;
   perspective: 1200;
  -moz-transform: perspective(1200px);
  -webkit-transform-style: preserve-3d;
  -moz-transform-style: preserve-3d; 
  transform-style: preserve-3d;
 }
.parcon img{
       transition:all 0.8s cubic-bezier(0, 0, 0.8, 1.0);   
 }
 .parcon:hover img{
   transform: translateX(10px) translateY(-14px) translateZ(60px) scaleX(1) scaleY(1) scaleZ(2) rotateX(40deg) rotateY(-3deg) rotateZ(-34deg) skewX(-5deg) skewY(6deg);
  }
</style>

<script>
     $('.parcon').addClass('t-cover__arrow-wrapper_animated');
</script>
Made on
Tilda