So I have a Lottie animation that I am trying to change stroke color as the page is scrolled. Forgive me as I am new to this, but I pinched this code off here and it works fine. How would I edit it so that is doesn’t effect opacity, but stroke instead?
function changeCss () {
var lake = document.querySelector(".lakec");
this.scrollY > 400 ? lake.style.opacity = 0 : lake.style.opacity = 1;
}
window.addEventListener("scroll", changeCss , false);
With my minimal knowledge I tried this, to no luck. What am I missing?
function changeCss () {
var lake = document.querySelector(".lakec");
this.scrollY > 300 ? lake.style.stroke = "black" : lake.style.stroke = "pink";
}
window.addEventListener("scroll", changeCss , false);
Bonus points to add a transition to the stroke colour change? Thanks so much