Задержка загрузки фоновых изображений
 

Так уж получилось, что в дизайне оочень много фоновых изображений. Все они имеют прозрачность, то есть приходится сохранять в png. Итого, страница весит 2 Мб(14 Кб html, остальное картинки). Можно ли как-нибудь фоновые изображения подгружать после того как вся страница загрузилась(без изображений, которые я хочу позже загрузить) и отобразилась пользователю? Точнее я сейчас сделал так:
в css прописано:

.image.stateVisible
{
    background-image...
}

Класс stateVisible добавляю по событию ready. И только тогда начинают грузиться картинки. Или это глупо т.к. картинки так и так грузятся во всех браузерах после загрузки html-я и css? Как правильно, подскажите, пожалуйста.

страница все равно за кэшируется после 1-ого открытия и после 2-ого открытия браузер будет уже подхватывать картинки с кэша, так что не заморачивайтесь.

Я бы не заморачивался, но:
1) Задача стоит, чтобы страница загрузилась быстро даже при первой загрузке сайта.
2) На разных страницах разные фоновые изображения уникальные. Поэтому вариант с кэшем не катит.

$.preloadImages попробуйте похимичить с этим, сам признаюсь никогда не использовал, может поможет

можно попробовать вынести стили с картинками в отдельный файл и подключить его в последнюю очередь