1) Заводите массив (или html атрибут) с url до изображений. В таком случае браузер не будет их загружать.
2) Создаем невидимый элемент img который будет служить прелоадером.
3) Биндим на него JQ метод .load
4) При прокрутки страницы до определенного изображения, передаем url картинки прилоадеру.
5) Как только он отвечает нам, ставим этот url в src или background-image.
Можно создать несколько прелоадеров, или генерировать их при необходимости, а потом удалять.
---------------
Если же нужно что-бы загрузилась вся страница, то можно сделать div:
.loader {
postition: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: red;
z-index: 99999;
}
Дальше вешаем обработчик на окно
$(window).ready ->
$('.loader').remove()
В этом случае, сайт появится только после того, как все элементы загружены и нарисованы