1 Editors' Choice Of 2018
Phosfluorescently re-engineer open-source manufactured products vis-a-vis an expanded array of potentialities.
Watch latest movies and glamour news in one app.
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