I'm currently trying to create a lightweight parallax effect in JS. The only problem that i'm running into is, when i try to assign the effect to elements mid-document. Here's the current code:
[].forEach.call(document.getElementsByClassName('parallax'), function (v) {
window.addEventListener('scroll', function () {
let eTop = $('parallax').offset();
let value = window.scrollY;
v.style.top = value * .5 + 'px';
});
});
If i now assign the 'parallax' class to objects below the top position they get weirdly transformed because their respective position is calculated using window.scollY resulting in heavily transformed positions. I guess the best way to deal with it is to subtract the elements actual position on the document, right? And if so how to do it? (newbie here)
Thamks in advance!