Hey everyone! I’m having a strange issue that I can’t seem to troubleshoot.
I’m building a portfolio site and on both the homepage and the work page I have a grid of “cards” that rotate along the X and Y axes in perspective while mousing over them. I followed the tutorial here to build these.
I have my Animation Resting States for both animations set to 50%, 50% (dead center), but when I mouseout, the cards are very slightly askew still as shown in the attached screenshot. Changing the perspective depth of the parent element (the respective grids) to a lesser number exaggerates this incorrect resting rotation.
Sometimes, upon initial page load, all the cards are (correctly) straight until I mouseover and then show incorrect resting states upon mouseout. Sometimes they’re askew from page load.
I’ve racked my brain but I can’t seem to figure it out. Can someone please help? Thank you!