дождитесь загрузки изображений в фоновом режиме (css)

Допустим, у нас есть слайд-шоу из фотографий. миниатюры этих изображений отображаются в div-оболочке с ползунком (который я создал с помощью Jquery), и каждое изображение включается в<li> с набором фона CSS, который, конечно, представляет изображение. Я решил использовать фоновое изображение для макета, потому что все они различаются по размеру и соотношению сторон.

Изображения приходят из БД и создаются динамически.

Что я хочу сделать, это:

показать сообщение «загрузки» над каждым<li> и подождите, пока фон (изображение) загрузится в кеш, а затем покажите его с fadeIn. Единственный способ, которым я могу думать (не то, что я могу, так как я не очень уверен, как и если это выполнимо):

временно отключить фон для каждого<li> при отображении сообщения «загрузка»сделать цикл для каждого фона, чтобы получить URL-адрес изображенияиспользуйте функцию $ .get для ее загрузки, а затем делайте все, что я хочу после загрузки

Помимо выполнимой вещи, это будет означать, что они будут загружаться последовательно, поэтому, если по какой-то причине никто не загрузится, скрипт никогда не продолжится!

Я видел некоторые сайты, которые используют JS для загрузки изображений только тогда, когда они видны браузером, возможно, это может быть тот же случай, который я ищу, так как я использую скроллер, и на экране отображается только часть изображений. один раз и когда страница загружается

Ответы на вопрос(1)

Ваш ответ на вопрос