Parallax doesn't work for images which in the middle of the page

[UlyanaKiklevich]

Expected Behavior

Parallax works everywhere

Actual Behavior

If the banner/image is somewhere below on the page, parallax doesn't work

Environment

It doesn't work even here on your demo: https://codesandbox.io/s/ljh9g?file=/src/App.vue

Problem root

The problem is located in this file: vue-parallaxy/dist/vue-parallaxy.js line 2677 where animationValue is calculated based on window.pageYOffset. As a result, when the page is scrolled deeply down, this value is about 4000px, and no animation happens. It should be changed to: var animationValue = this.$refs.block.getBoundingClientRect().y * this.speedFactor; and then if (animationValue <= availableOffset && Math.abs(animationValue) >= 0)
With this solution, parallax animation will be calculated based on the current block scroll offset, but not the whole page.