Benvenuto Caricamento in corso ... Pagina con Jquery

Question

Come posso implementare una schermata di benvenuto per 5 secondi fornendo informazioni come Caricamento dell'applicazione ... + alcune informazioni sulle applicazioni ... mentre la pagina principale viene caricata in background.

Answer 1

Penso che sia accettabile per avere un 'loading ...' pagina in alcuni casi - per esempio, dopo un utente a un log delle applicazioni di business a (pensa a TurboTax online ... dice qualcosa come "stabilire una connessione sicura", che probabilmente non è esattamente vero, ma caricare le cose dell'interfaccia). Mostrare la pagina ogni volta che un utente anonimo visita il tuo sito probabilmente non è la migliore idea.

Dai uno sguardo allo jQuery BlockUI. È flessibile e può fare ciò di cui stai parlando.

Answer 2

A meno che non si stia effettivamente utilizzando quel tempo in background per effettuare una sorta di pre-caricamento, suggerirei fortemente contro questo aspetto da una prospettiva dell'utente finale. Personalmente troverei fastidioso che quando si va su un sito web, dovrei fare una specie di presentazione prima di arrivare al contenuto che voglio.

Questo è il motivo per cui tendo a odiare i siti Web progettati in Flash o quelli che incorporano semplicemente una pagina iniziale di Flash.

Modifica: Non penso necessariamente che il carico della pagina principale si possa qualificare per molto sulla scala del "precaricamento", a meno che non richieda un uso intensivo delle risorse. Di nuovo, queste sono solo le mie opinioni.

Modifica n. 2: Si potrebbe anche obiettare che i visitatori del tuo sito Web decideranno se rimanere o basarsi su un minimo di cinque secondi. Ricorda che coloro che usano Internet tendono ad avere l'attenzione dei moscerini della frutta, e metterli in un modello di attesa prima di arrivare effettivamente al contenuto è un buon modo per perdere quegli utenti.

Answer 3

Visualizzerai il messaggio di benvenuto man mano che la pagina viene caricata (teoricamente come overlay in posizione assoluta). È quindi possibile utilizzare jQuery per dare il via un timer:

$(document).ready(function(){ 
    setTimeout(function(){ 
     $('div#overlay').fadeOut(); 
    }, 5000); 
}); 

Answer 4

Anche se sono d'accordo con @TheTXI, il modo migliore per farlo è quello di avere il "loading ..." schermo visibile di default usando i CSS, e poi nascondilo una volta che tutto viene caricato usando jQuery (invece di aspettare un intervallo di tempo fisso).

Vedi jQuery.load() ... Es:

$(document).ready(function(){ 
    $("body img:last").load($("#welcome-screen").fadeOut()); 
    }); 

Answer 5

solo per chi in futuro trova questo, ho trovato una soluzione più elegante che funziona.

http://www.jnorton.co.uk/blog/jquery-check-if-all-content-has-been-loaded

ecco come l'ho usato:

$(document).ready(function(){ 
    $(window).load(function() {$("#welcome").fadeOut('fast'); }) 
});