Переход в масках-изображении ⇐ CSS

[Anonymous]

У меня есть контейнер, в котором применяется исчезновение с правой стороны, но я хочу, чтобы исчезновение переходило. Так что при загрузке отображается содержание, а затем плавно переходы маски . Есть идея?

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

.container {
background-color: black;
}

.container--right-fade {
mask-image: linear-gradient(-90deg, transparent, #000 32px);
}

.list {
display: grid;
grid-auto-flow: column;
}

.list-item {
display: flex;
align-items: center;
justify-content: center;
height: 250px;
width: 250px;
background-color: rgb(153, 51, 0);
}< /code>


[*]Content
[*]Content

Подробнее здесь: https://stackoverflow.com/questions/796 ... mask-image