Skip to content

Instantly share code, notes, and snippets.

@perrysmotors
Last active October 9, 2022 08:34
Show Gist options
  • Save perrysmotors/7154f31cf957f8f021d0444af7cab021 to your computer and use it in GitHub Desktop.
Save perrysmotors/7154f31cf957f8f021d0444af7cab021 to your computer and use it in GitHub Desktop.
Transform the height of a layer as you scroll in Framer X
import { Override, motionValue, useTransform } from "framer"
const contentOffsetY = motionValue(0)
// Apply this override to your scroll component
export function TrackScroll(): Override {
return { contentOffsetY: contentOffsetY }
}
// Apply this override to your app bar
export function AppBar(): Override {
const height = useTransform(contentOffsetY, [0, -52, -52], [140, 88, 88], {
clamp: false,
})
return {
height: height,
}
}
@WLDO
Copy link

WLDO commented Jun 5, 2019 via email

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment