[JavaScript] Preloader Images, Szukam gotowego rozwiązania... Opcje

[Jackon]

Witam, mam pewną ociężała stronę - waży ok. 2mb chciałbym znaleźć jakiś gotowy preloader images - czyli skrypt wymuszą pierw załadowanie grafiki zanim wyświetli stronę. Nie podoba mi się, że widać proces ładowania oraz to, że hovery nie spełniają swoje zadania bo miga biała plama pierw. Psuje to wszelkie efekty. Zdaje sobie sprawę, że ktoś może mieć wolniejszy internet mi osobiście strona nie ładuje się więcej niż 3-4 sekundy chociaż mam mobilny, ale dobrze by było gdyby można było w tym zastosować jakiś "loading" gif żeby nie było, że skrypt wykonuje się w tle przy białej stronie. Szukałem w sieci oczywiście. Znalazłem parę pozycji, ale nie działają... jakieś propozycję?

[lukasz1985]

Grafikę strony powinieneś wyświetlić po załadowaniu strony natomiast treść, którą stanowią obrazy zacząć ładować dopiero po wyświetleniu grafiki. Musisz postępować według tego wzorca:

[JAVASCRIPT] pobierz, plaintext 
 
 
window.onload = function() {
 
   // ... wyswietl całą grafikę dokumentu ... np:
   document.body.style.display = "block"; //gdzie uprzednio w CSS było body {display: none}
 
   // zdefiniuj obrazy które dopiero teraz będą ładowane:
 
   var img1 = new Image();
   img1.src = "url/obrazka.png";
   img1.onload = function() {
        // kod wyswietlający obrazek:
        document.body.appendChild(img1);
   }
}
 
[JAVASCRIPT] pobierz, plaintext 

Tak wygląda schemat postępowania w tym przypadku.