Skip to content

Commit 2ad608f

Browse files
committed
readme updated
1 parent 401963c commit 2ad608f

File tree

1 file changed

+40
-0
lines changed

1 file changed

+40
-0
lines changed

README.md

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,46 @@ Each `MotionParticle` child of `MotionParticlesContainer` will move based on mou
3838

3939
Negative `motionSpeed` values will move the MotionParticle in the opposite direction of the mouse movement or device movement.
4040

41+
You can also use the `MotionParticlesContainer` at the root of your react app and then you can use the `MotionParticle` component anywhere in your app.
42+
43+
```js
44+
// App.js file
45+
import React from 'react';
46+
import MotionParticlesContainer from '@wensyve/react-motion-particles';
47+
48+
function App() {
49+
return (
50+
<MotionParticlesContainer>
51+
<div className="app">
52+
{/* Your content */}
53+
</div>
54+
</MotionParticlesContainer>
55+
);
56+
}
57+
58+
export default App;
59+
```
60+
61+
```js
62+
// SomeOtherComponent.js file
63+
import React from 'react';
64+
import { MotionParticle } from '@wensyve/react-motion-particles';
65+
66+
function SomeOtherComponent() {
67+
return (
68+
<div>
69+
<MotionParticle motionSpeed={2.5}>
70+
<div>{/* Your content */}</div>
71+
</MotionParticle>
72+
<MotionParticle motionSpeed={1}>
73+
<div>{/* Your content */}</div>
74+
</MotionParticle>
75+
</div>
76+
);
77+
}
78+
```
79+
80+
4181
## Contributing
4282
Contributions are welcome! Feel free to open an issue or submit a pull request if you have a way to improve this project.
4383

0 commit comments

Comments
 (0)