Skip to content

Instantly share code, notes, and snippets.

@koss-lebedev
Created October 11, 2019 09:38
Show Gist options
  • Save koss-lebedev/2121cef6682d3fe145d1e3b643aa7480 to your computer and use it in GitHub Desktop.
Save koss-lebedev/2121cef6682d3fe145d1e3b643aa7480 to your computer and use it in GitHub Desktop.
import { useScroll } from "react-use-gesture";
const App = () => {
const [style, set] = useSpring(() => ({
transform: "perspective(500px) rotateY(0deg)"
}));
const bind = useScroll(event => {
set({
transform: `perspective(500px) rotateY(${
event.scrolling ? event.delta[0] : 0
}deg)`
});
});
return (
<>
<div className="container" {...bind()}>
{movies.map(src => (
<animated.div
key={src}
className="card"
style={{
...style,
backgroundImage: `url(${src})`
}}
/>
))}
</div>
</>
);
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment