Component dropping effects after animating in
senwmn opened this issue · 7 comments
🐛 Component dropping effects after animating in
After animating a Tilt component in based on X or Y values, the X and Y axis for the tilt component seems to be locked and reversed in a way.
I've made a test sandbox here:
https://codesandbox.io/s/tender-pasteur-f9lmc
Expected behavior
There's 3 tilt components labelled. The middle component labelled 'without motion' should be the effect for the 'with motion', but theres some strange behaviour going on. There's no issue when you add the event to the whole window though, so it is most likely something to do with the animating I believe. All the components have the same props and everything too.
Environment
- Browser: Chrome / Mac
- Version: "react-parallax-tilt": 1.4.70
❤️ this package btw!
TIA
I've been having the same issue. Whenever the Tilt component is moved in any way, it's animation gets offset and moves in a weird way.
@mkosir Thanks! It's working, but there are two other problems now:
- On page load the tilt components have a glare on them until you hover over them
- When the tilt components move the animation isn't offset anymore (thank you), but the components do have a slight tilt
Here's a video of those two problems
ezgif.com-crop.mp4
@sher-s7 thank you for the video, it clearly shows the issue you are having, but I'm unable to reproduce it. Could you please create and share a demo link?
@mkosir This is slightly similar https://codesandbox.io/s/gifted-river-vjhhj?file=/src/App.js
After pushing the tilt components down you can see they get rotated, but work fine after hovering over them