Hello, dummy here.
I’ve created a class so my ‘jumpy’ jumps a little every time upon clicking on it.
.jumpy{
transform:
transform-style: flat;
transition: transform 0.2s ease-in-out;
}
.jumpy:active{
transform: translateY(-20px);
}
It works great.
Now how do I apply the same effect on ‘jumpy’ but by clicking onto a different box or button? Thank you!
Using Wix Studio Editor.
Hi ruell,
We meet again. Small tutorial before bed!
The code you provided is using the css so you’re going for the custom trigger
I tried it but you it’s not working, translate is working but the flat transform is not working. But it can be made by using iframe or custom element (upgrade to premium)
@noahlovell Is this transition not supported on Wix Studio using css global file yet , Sir?
Hi again ^^
I think I have to explain better what I’m looking for:
right now i have an object called ‘jumpy’ that is moving up and down every time i click on it. It is working with the code i provided in example. My question is: how do i get “jumpy” behave the same way but when i click on “box1” and not the ‘jumpy itself’?
Can you provide how you animate the current one? Is your animation has flat effect or just translate?
For normal translation X and Y, you can use Wix animations from inspector panel or just velo.
What I want to know clearly is
Flat transition is not working when I use Wix css classes and add customClassList (velo).
Also design panel animation has only move animation which translates X and Y.
If you want only translate animation, I’ll share you at next morning (currently midnight) , but the
transform-style: flat;
It’s not working with 3D style animations.
@ms-ruell Here is the solution,
add animation in the click section.
Choose which element you want to animate.
Then choose “Move”
Now choose the angle you want to animate. Since you want to animate Y-20px, angle must be 0degree.
Sorry for the flat transition. Wix Studio doesn’t seem to support it even using css global file and velo code.