I have created an overlay on the third section of my homepage and created the interaction on the parent div .up so that the children div moves up and appear.
I created an easing so the animation is not abrupt. BUT the first time you hover on the div the overlay comes up abruptly while the second time respond to the right interaction indications.
I know is the browser which does not read well the interaction and that I have to “force” it but I have no Idea how to do that.
Could someone explain me precisily what I have to do ?
Hi, try keeping vertical movement on both hover and hover out animations to the same amount, like initial state its 8000px and on hover out its 500px I changed these to 500px and it seem to solve the issue for me.
Also I feel there are better ways to do this animation, you can try youtube tutorials.
That’s awesome. thank you very much !! Why you think this way is not that good?
In fact I have another bug on the same animation. On the the .up parent div I put a text inside in flex center which I want to make dissapear on hover. But the intial on the publised site that flex center and bottom does not work. Do you know what it could be ? I really thank you anyway
Why you think this way is not that good?
Because I feel there is too much going on in your animations, the same effect can be done with less code like in screenshots below
Glad you solved the problem Ah! and yes rest is super important but I am sending another problem your way when you get back from a break haha , the problem is when you hover over the up container slighly rom any side then it won’t trigger the animation untill you move your curse further inward and also once the hidden div is revealed and then when you try to move your cursor over divvo then the hover out animation triggers which shouldn’t right? It should stay stable so people can copy text or click on find out easily.
Yes you’re absolutly right. Even if, on my pc when my cursor is on the block, the overlay seems stable. Which solution would you suggest ?? and i m glad u highlight another problem so we can find a solution !!!
Ah! and yes rest is super important but I am sending another problem your way when you get back from a break haha , the problem is when you hover over the up container slighly rom any side then it won’t trigger the animation untill you move your curse further inward and also once the hidden div is revealed and then when you try to move your cursor over divvo then the hover out animation triggers which shouldn’t right? It should stay stable so people can copy text or click on find out easily.