amihanya Posted May 5, 2020 Share Posted May 5, 2020 I have a simple animation that upend every time the user over on button. i have a 10 buttons one near the other. and the imageContainer show the prodact. when the user go our from the button i want to hide this element. gsap.from("#imageContainer", .5, {css:{scaleX:0.8, scaleY:0.8, opacity:0}}); on the first time that work great but is the mouse run on the button the animation stop work and the image stack on opacity 0. i try to use restart. seek and kiil but dont foud the right way to start the animation every time from the begin. Link to comment Share on other sites More sharing options...
ZachSaucier Posted May 5, 2020 Share Posted May 5, 2020 Hey amihanya. It's really hard for us to trouble shoot blindly. Can you please create a minimal demo of the issue in something like a CodePen? This thread talks more about ho to do so: Link to comment Share on other sites More sharing options...
OSUblake Posted May 5, 2020 Share Posted May 5, 2020 You probably need a fromTo animation. If you interrupt the animation, it's going to animate the opacity from 0 to the current opacity value. Quickly click the button to see the problem. You can fix it using a fromTo animation. See the Pen 8737c62b8f3253745552bba7992c58b4 by osublake (@osublake) on CodePen 4 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