Hello together,
I have a problem with a parallax animation i made. The effect works as follows:
There are 2 sections surrounding a parallax element. This parallax element will be moved if a scroll event was triggered.
How fast the element is going to move is defined by a speed value. This value should be something between -1 and 1. So the element will move down if the speed is positive and up if it’s negative.
To prevent a gap between the sections and the parallax element a new height will be calculated for the moving element, so it won’t show the gap until the element is no longer visible within the viewport.
This works just fine if the speed value is positive and the element is moving downwards, but my problem is: if I change the speed to a negative value, the calculations for the height and position of the parallax element are no longer valid and the gap is still there.
My thought was that the calculation for the height of this element is wrong, because it’s too small, but i can’t get it to work 
Maybe some of you knows exactly where the problem is. I would really appreciate an answer 
Sitting on this problem for days.
Fiddle: https://jsfiddle.net/xs74pmvq/
Thank you in advance.