Измените текст и цвет GIF, когда они накладывают другие GIF ⇐ CSS

[Anonymous]

Элемент A - это Div с черным текстом (элемент SPAN) и GIF черного текста (элемент IMG), которая имеет исправленную позицию. Element B is a color GIF (img element) that does not have position fixed and when you scroll, it can go beneath element A.
What I want is to change Element A and turn it all white when Element B goes beneath it.

Код: Выделить всё

.overlay {
display: flex;
flex-direction: column;
position: fixed;
}
.text {
font-size: 60px;
color: black;
}
.overlaygif {
width: 250px;
}
.underneathimage {
margin-left: 75px;
margin-top: 300px;
margin-bottom: 500px;
}< /code>

Hello
[img]https://media.tenor.com/iIJVkgtVYgMAAAAi/tom-darondovas-signature.gif[/img]

[img]https://media4.giphy.com/media/v1.Y2lkPTc5MGI3NjExbDRndjFxNWp5NzR4NGJzYmgxM2h5Nm4wbjRldDI2NGs3NGIwa3dwdyZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/dvOqEdPBJ6LQMoYa6Z/giphy.gif[/img]

в этом видео вы можете увидеть разницу между тем, что делает код, и чего я хотел бы достичь.>

Подробнее здесь: https://stackoverflow.com/questions/797 ... -other-gif