Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
Framer X WindowResizeListener
// https://framer.slack.com/archives/CB74N2FDY/p1557954143213500?thread_ts=1557952502.211200&cid=CB74N2FDY
import { Override, Data } from "framer"
import * as React from "react"
const initialSize = document.body.getBoundingClientRect()
const preview = Data({ width: initialSize.width, height: initialSize.height })
export function WindowResizeListener(): Override {
React.useEffect(function() {
function updateViewSize() {
const rect = document.body.getBoundingClientRect()
preview.width = rect.width
preview.height = rect.height
}
window.addEventListener("resize", updateViewSize)
return function removeListener() {
window.removeEventListener("resize", updateViewSize)
}
})
return {
width: preview.width,
height: preview.height,
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment