An easy to use Mouse Parallax Component with Vue.js
vuejs-mouse-parallax
An easy to use Mouse Parallax Component - Made with Vue.js
Usage
In order for the effect to work, the should be contained within
Options can then be passed to like so :
// App.vue
<parallax-container>
<parallax-element :parallaxStrength="-5" :type="'translation'">
<h2>Put your content here</h2>
</parallax-element>
</parallax-container>
Props
| Prop | Type | Default Value | Description |
|---|---|---|---|
| parallaxStrength | Number | 10 | Strength of the Parallax Effect |
| type | String | 'translation' | 'translation' - 'rotation' - 'depth' |
Build Setup
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run build
# run unit tests
npm run unit
# run all tests
npm test