File tree Expand file tree Collapse file tree 2 files changed +47
-0
lines changed Expand file tree Collapse file tree 2 files changed +47
-0
lines changed Original file line number Diff line number Diff line change
1
+ # ` @rehooks/window-scroll-position `
2
+
3
+ > React hook for [ Window] ( https://developer.mozilla.org/en-US/docs/Web/API/Window ) scroll position
4
+
5
+ > ** Note:** This is using the new [ React Hooks API Proposal] ( https://reactjs.org/docs/hooks-intro.html )
6
+ > which is subject to change until React 16.7 final.
7
+ >
8
+ > You'll need to install ` react ` , ` react-dom ` , etc at ` ^16.7.0-alpha.0 `
9
+
10
+ ## Install
11
+
12
+ ``` sh
13
+ yarn add @rehooks/window-scroll-position
14
+ ```
15
+
16
+ ## Usage
17
+
18
+ ``` js
19
+ import useWindowScrollPosition from ' @rehooks/window-scroll-position'
20
+
21
+ function MyComponent () {
22
+ // optionally you can pass options, those are default:
23
+ let options = {
24
+ throttle: 100 ,
25
+ passive: true ,
26
+ }
27
+ let position = useWindowScrollPosition (options)
28
+ // position == { x: 0, y: 0 }
29
+ return < div / >
30
+ }
31
+ ```
Original file line number Diff line number Diff line change
1
+ import React from 'react'
2
+ import { render } from 'react-dom'
3
+ import useWindowScrollPosition from './'
4
+
5
+ function App ( ) {
6
+ let position = useWindowScrollPosition ( )
7
+ return (
8
+ < div
9
+ style = { {
10
+ position : position . x === 0 ? 'fixed' : 'absolute' , // is on top
11
+ } }
12
+ />
13
+ )
14
+ }
15
+
16
+ render ( < App /> , window . root )
You can’t perform that action at this time.
0 commit comments