I want to change z-index value to flip elements up and down, It will give full form creating effect, But not working, help me

Question

https://code.sololearn.com/Wi85YGsv3vyO/?ref=app

Answer 1

This is the example I made, the syntax of the keyframes for the animation and the use of perspective and transform properties are important. Is this what you were looking for. I hope I helped.

https://code.sololearn.com/WKhqt3ZwcJpl/?ref=app

Answer 2

thank you Jay, but can you please give example for better understanding

Answer 3

wow.....it's impressive, really very nice, and thank you so much.

Answer 4

From my understanding, if you are looking for a flip animation, you have to use the transform property in CSS, z-index only changes the layer index for an element, the higher it is, the higher the priority, and it will show over other elements based on the way they are built.

Answer 5

No problem! You also might enjoy able to find some 3d css animation tutorials online, they really help.

Answer 6

can you send me link for 3D SSC tutorials. and please give me example of drag and drop API.

Answer 7

3D CSS Animations Tutorial:
https://desandro.github.io/3dtransforms/

Drag and Drop API Tutorial:
https://www.w3schools.com/html/html5_draganddrop.asp