vue-parallaxScrolls a image slower than the window to create a neat optical effect.
npm install --save-dev vue-parallax@1
# in your component components: "parallax": require("vue-parallax") # or, when using bundle.js components: "parallax": window.vueComps.parallax
content will be shown after loading
<parallax src="path/to/img"> <div slot="loading">loading...</div> <div>content</div> </parallax>
For examples see
WebpackIf your assets are organized by webpack, this should work:
PropsName | type | default | description ---:| --- | ---| --- src | String | - | (required) path to image height | Number | 500 | height of the parallax element speed | Number | 0.2 | 0.0 means the image will appear fixed in place, and 1.0 the image will flow at the same speed as the page content.
EventsName | description ---:| --- | ---| --- image-loaded | will be called when the image is loaded loaded | will be called when the first calculation - after a image is loaded - is finished
now working on devices in portrait mode
added unit tests
now working with firefox
npm install npm run dev