2013-02-25 10 views
5

Dies ist meine erste Frage, also werde ich hoffentlich genug Details geben. Ich habe den folgenden Code in 4 Seiten auf einer Website:jQuery, Anzeige Lade Seite div nur, wenn die Seite mehr als 2 Sekunden zum Laden braucht

$(document).ready(function() { 
    $('#page_loading').slideDown(500); 
}); 

jQuery(window).load(function() { 
    setTimeout(function() {$('#page_loading').slideUp(500);}, 1500); 
}); 

Was ich bin, ich versuche zu erreichen: Wenn die 4 Seiten gründlich durchsucht, habe die #page_loading div nach unten rutscht nur, wenn die Seite mehr als 2 Sekunden dauert Laden. Wenn das Laden der Seiten weniger als 2 Sekunden dauert (wurde zuvor besucht und die meisten Bilder werden zwischengespeichert), wird das Lade-Div nicht angezeigt.

An dieser Stelle, selbst wenn die Seite dauert weniger als eine Sekunde zu laden, das Laden div immer noch erscheint und verschwindet, und es ist ziemlich nervig.

Danke, Cristian.

+0

Verwenden Sie 'setTimeout', um slideDown um zwei Sekunden zu verzögern; Nach den zwei Sekunden überprüfen Sie, ob Sie immer noch slideDown sollten. –

+0

das nach 1500 Millisekunden ruft – PSR

+0

Nun, das ist eigentlich die Frage, wie überprüfe ich, ob die Seite nach 2 Sekunden vollständig geladen wurde, und wenn es geladen hat, nichts tun. Wenn es nicht geladen wurde, schieben Sie das Lade-Div herunter, das darauf warten sollte, dass die Seite geladen wird und dann wieder aus der Ansicht hochgleitet. –

Antwort

3

Wird dies den Trick machen?

var showTimeout = setTimeout(function() { 
    $('#page_loading').slideDown(500); 
}, 2000); 

jQuery(window).load(function() { 
    clearTimeout(showTimeout); 
    $('#page_loading').slideUp(500); 
}); 
+0

Arbeitete perfekt, danke! –