(Весь код здесь упрощен, а не настоящий код)
У меня есть css, который выглядит как
background-image: url("/img/high-res.png"),url("/img/low-res.png"),url("/img/blur.png");
Это работает нормально, но потому что background-image складывает изображения, прозрачные области на изображении с высоким разрешением имеют свечение от размытого изображения, которое находится внизу.
Есть ли способ в css скрыть все, кроме видимого слоя, вместо того, чтобы складывать их ?
Если нет, есть ли лучший способ, отличный от js, для загрузки первого (2 КБ) изображения, затем второго (100 КБ), а затем полноразмерного (4 МБ) изображения, скрывая изображения с низким разрешением, как только загрузятся версии с более высоким разрешением?