Simulating mobile scroll with moving images

Hi!

I’ve been stuck on this one for ages and can’t seem figure it out:

What I’m trying to create is a simulation of scrolling the mobile design of a project inside a phone frame while scrolling in view. It seems to be working perfectly fine in preview, but as soon as I publish the site, the images starts disappearing.

Sometimes only one of the images are displayed and working, sometimes none, but never both.

While troubleshooting the issue with the inspect tool, I’ve noticed that deselecting the will-change CSS property displays the image and then it works as intended.
Not sure of the relevance, but this is at least as far as I’ve gotten.

I’m not sure if the height of the images could be an issue, but I’ve scaled them down quite a bit(still quite large though).

Any help would be highly appreciated.

Screenshot from preview:

Screenshot from published:


Read-Only

Published link