Window Size

Reactive window size.

Usage

<script>
    import { windowSize } from "@sveu/browser"

    const { width, height } = windowSize()
</script>
<script>
    import { windowSize } from "@sveu/browser"

    const { width, height } = windowSize()
</script>
svelte

Example

0 x 0

<script>
    import { windowSize } from "@sveu/browser"
    const { width, height } = windowSize()
</script>

<p class="text-center">{$width} x {$height}</p>
<script>
    import { windowSize } from "@sveu/browser"
    const { width, height } = windowSize()
</script>

<p class="text-center">{$width} x {$height}</p>
svelte
1
2
3
4
5
6
Click fold/expand code

API

Options

Name Description Type
initialWidth The initial width of the window. number
initialHeight The initial height of the window. number
orientation Whether to use the orientationchange. boolean
scrollbar Whether the scrollbar should be included in the width and height. boolean


Returns

Name Description Type
width A readable store with the window width. Readable<number>
height A readable store with the window height. Readable<number>