How to make 2D transforms ‘desktop-only’

Hey all, quick one.

Is there a snippet of code / feature that makes subtle 2D transforms (eg a rotation on hover) only triggered on larger screens? I feel that these will get in the way of the UX on a phone screen. Thanks !

Hey there

You dont need any script for that. You can easily create hover effects and limit them to larger screens.
I think these three tutorials will help you get what you want: (I recommend watching them in the following order…)

And if you want to limit those animations just to desktop, just go to the tablet breakpoint and go into the hover-state of your object and remove all changes you made for desktop.
Now the hover effects will show on desktop but not on all devices with smaller screens.