Эффект прозрачности текста CSS через слой ⇐ CSS

[Anonymous]

Я хочу сделать текст на веб-сайте прозрачным относительно элемента div, расположенного под ним.
У меня есть два элемента div — «контент» и «оверлей», которые располагаются друг над другом. и перекрывают друг друга.

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

//I also use JS to transform the overlay after DOM loaded:
document.addEventListener("DOMContentLoaded", function() {
var overlay = document.querySelector(".overlay");
setTimeout(function() {
overlay.style.transform = "translateX(0px)";
}, 2000);
});

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

.slide-container {
position: relative;
}
.content, .overlay {
position: absolute;
padding: 100px;
}
.content {
width: 100%;
height: 600px;
background-image: url(img.jpg);
background-size: contain;
}
.overlay {
background-color: rgba(23,30,32, .9);
backdrop-filter: blur(5px);
width: 100%;
height: 600px;
transform: translateX(60vw);
transition: ease 2s all;
color: white;
}

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

    


Some text
Some more text

Текст находится только в блоке «overlay». Можно ли сделать цвет текста таким же, как фон, который в данный момент находится под его элементом div?
Независимо от переводаX элемента наложения, а также в момент перехода, я хочу, чтобы текст всегда отображал фон под ним.
Вот точный пример желаемого эффекта (Imgur).

Подробнее здесь: https://stackoverflow.com/questions/787 ... ough-layer