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 и добавили в него фото
2. Добавили скрипт на страницу
В коде скрипта меняем класс фото на свой:
tn-elem__617244391532956290185 - класс div блока с фото
Скрипт добавляется в блок ДРУГОЕ►Т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 {
  -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 img:hover{
   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>
     $('.tn-elem__617244391532956290185 .tn-atom').addClass('parcon');
</script>
Made on
Tilda