Hernando Posted February 24, 2019 Share Posted February 24, 2019 (edited) I have a transformation that works: transform: perspective(700px) rotateY(20deg); transition: all 1.6s; This is all I had to enter into the custom CSS Main Element section of an image module in Divi. I want it to wait 2 seconds before it initiates. How do I do that? Edited February 24, 2019 by Hernando Link to comment Share on other sites More sharing options...
Ingolme Posted February 24, 2019 Share Posted February 24, 2019 There's a transition-delay property https://developer.mozilla.org/en-US/docs/Web/CSS/transition-delay Link to comment Share on other sites More sharing options...
Hernando Posted February 25, 2019 Author Share Posted February 25, 2019 (edited) That worked. BUT I neglected to tell you the ENTIRE story, my fault. Sorry There's a second part of my effect, hover. When the mouse hovers over the canted image, the image returns to normal while being held. Let go of the mouse and the image goes back to canted. Now, with the delay, the hover is no longer immediate but holds 2 seconds. I want the image to move nearly instantly with the hover. I tried adding a second time delay — transition-delay: 1s; 250ms — but that didn't seem to do it. Here's the ENTIRE code I entered. Again, sorry for not being correct the first time. Main Element CSS (default): transform: perspective(700px) rotateY(45deg); transition: all 1.6s; transition-delay: 1s: 250ms Main Element CSS (hover): transform: perspective(700px) rotateY(0deg); Edited February 25, 2019 by Hernando forgot detail Link to comment Share on other sites More sharing options...
Funce Posted February 25, 2019 Share Posted February 25, 2019 I had a look around. This probably best answers it: https://stackoverflow.com/questions/3627135/is-it-possible-to-set-different-duration-delay-for-transform-options You'll need to nest the elements if you want differing transition options, because transform is a single animation, and therefore grouped together for the 'transition', you won't be able to normally get different transition options. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now