Visualizzazione dei risultati da 1 a 7 su 7
  1. #1

    [Help] Implementare una pagina di attesa...

    Sto creando una pagina in Html4. Dato che ho dovuto mettere alcune immagini, la pagina è divenuta piuttosto corposa. Vorrei che l'utente potesse visualizzarla subito dopo che tutte le immagini e le applet siano state caricate.

    Avrei bisogno di implementare una pagina di attesa, magari con un contatore che indica quanto manchi in percenutale o in kb al caricamento completo, per poi rimandare alla pagina definitiva con un effetto di transizione. Che mi consigliate?

    Grazie in anticipo per l'aiuto...

  2. #2
    Utente bannato
    Registrato dal
    Nov 2003
    Messaggi
    558
    Perchè invece non metti le immagini molto piccole (in modo da risulare molto più leggere) e ad ogni immagine associ un link che porta all'immagine alle sue dimensioni standard in una finestra indipendente?

  3. #3
    Utente di HTML.it L'avatar di Edipo
    Registrato dal
    May 2003
    Messaggi
    1,239
    Non so aiutarti nel particolare del codice!
    Ma ti so dire di sicuro che intendi creare un preload in DHTML, credo, quindi prova a farti una ricerca su google.
    Poi se sto sbagliando..
    "Il tempo aiuta a dimenticare e il destino regala sempre una seconda occasione.
    Ma aprirsi all'amore significa rendersi vulnerabili".

    Nicholas Sparks

  4. #4
    Il dinamic html serve solo a creare un preloader "fittizio" giusto per lo stile della pagina. A me servirebbe un preloader di pagina vero e proprio: in pratica, mentre l'utente guarda la pagina di preload col contatore che avanza, il suo computer sta scaricando la pagina successiva che verrà poi visualizzata. Suppongo che per questa operazione, oltre al flash5 (che però non so usare), ci vorrebbe qualcosa tipo qualche applet java...

    Purtroppo non posso ridurre la quantità di kb necessari per visualizzare la pagina. Vorrei mettere un preloader perchè coloro che vedono la pagina con un 56kbps si perdono l'impatto della pagina stessa...

    Please heeeeeeeeeeeelp...

  5. #5
    Utente di HTML.it L'avatar di Edipo
    Registrato dal
    May 2003
    Messaggi
    1,239
    Cold ho cercato e alla fine ci sono riuscito per la miseria!!
    E' un preload in js di "Oronze e per il movimento di Robycz", allora è un preload a tutti gli effetti, funziona con una maschera che nasconde il contenuto della pagina in attesa che si sia caricata del tutto, non appena termina lo scaricamento questo livello "maschera" con un'animazione va via e compare la pagina!!
    Guarda è molto simpatico!
    Creati una pagina Loading.js e inserisci questo:
    var simulafor=0; //simula il ciclo for non utilizzato per la sua velocità di esecuzione
    var maxfor=screen.width; //è il movimento del layer. Impostando questo valore il div uscirà dallo schermo sia che ha risoluzione 10*10 che 1000*1000 (risoluzioni paradossali)
    function muovi(movx,movy,simulafor) //funzione del movimento
    {
    simulafor+=1;
    if (simulafor<=maxfor) //parte il ciclo for
    {
    livello.style.pixelLeft+=movx; //incremento della posizione
    livello.style.pixelTop+=movy; //incremento della posizione
    setTimeout("muovi("+movx+","+movy+","+simulafor+") ",ritardo); //ritardo per permettere la visualizzazione
    }
    }

    var pasx=-50; /*spostamento rispetto al margine superiore (il - lo fa spostare indietro, il + avanti)*/
    var pasy=0; /*spostamento rispetto al margine sinistro (il - lo fa spostare cerso il basso, il + verso l'alto)*/
    var ritardo=1; /*ritardo del moto (per accellerarlo o ritardarlo consiglio di aumentare o diminuire i valori di pasx e pasy ma se sono già impostati a 1 potete aumantere questo valore)*/

    var incdeccalfa = -5; //variazione della sfumatura
    var tempo = 50; //velocità della sfumatura

    function diminuisci(cosa) { //funzione per diminuire l'alfa
    meno = cosa
    diminuizione=setInterval("deincremento(meno)",temp o) //inizio dell'intervallo
    setTimeout("clearInterval(diminuizione)",1000); //cancellazione dell'intervallo N.B. se cancellate questa riga l'intervallo rimarrà impostato e la navigazione potrà risultare molto lenta
    }

    function deincremento(cosa2) { //funzione che specifica cosa deve impostare nell'intervallo
    cosa2.filters.alpha.opacity+=incdeccalfa //aumento dell'alfa
    }
    function elimina(){
    diminuisci(livello); //inizio della diminuizione dell'alfa
    muovi(pasx,pasy,simulafor); //inizio moto
    }
    Poi la tua pagina con le miniature, che farà anche da preload:
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <style>

    .classe {
    position:absolute;
    width:102%;
    height:100%;
    background-color:#ffffff;
    visibility:show;
    left:0px;
    top:0px;
    z-index:+10;
    FILTER: alpha(opacity=100);
    }

    </style>
    <script language="JavaScript" src="Loading.js"></script>
    </head>

    <BODY OnLoad="elimina()">
    <div id='livello' class='classe'>Scrivete qui il contenuto del livello/preload.</div>
    [img]blabla.jpg[/img]
    </body>
    </html>
    Le scritte in neretto vanno inserite. Il ilvello maschera di cui ti parlavo è il div con classe = "class", tutto cio che andrà inserito nella pagina deve stare sotto di questo livello!
    Provalo se non capisci bene come funziona...
    "Il tempo aiuta a dimenticare e il destino regala sempre una seconda occasione.
    Ma aprirsi all'amore significa rendersi vulnerabili".

    Nicholas Sparks

  6. #6
    Utente di HTML.it L'avatar di Edipo
    Registrato dal
    May 2003
    Messaggi
    1,239
    Fai anche sta cosa, nella classe oltre a specificare solo la larghezza, inserisci anche l'altezza height:100%; come mi consigliava Xinod, in modo che copre tutto per bene!
    :mavieni:
    "Il tempo aiuta a dimenticare e il destino regala sempre una seconda occasione.
    Ma aprirsi all'amore significa rendersi vulnerabili".

    Nicholas Sparks

  7. #7
    Hai tutta la mia stima :adhone:

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.