Pagine "temporanea"

digital.daigor

b'è.....ci sono un paio di metodi usabili ma quello ke uso io è questo:

usare un iframe/div in un div a tutta pagina inserito prima del <html> e stampata l'ultima righa di code....con javascript...farlo scomparire

Con php è pressochè impossibile, dato ke anke pausando l'esecuzione....il tutto avviene sul server prima di arrivare al client.

cali1981

Ciao, grazie per la dritta, potresti però farmi vedere un pò di codice js?
thanks

digital.daigor

<div id="loading" style="left: 25%; top: 25%; position:absolute; backgroung: #FF9900;">Caricamento</div>
<html>
.....
<script>
document.getElementById('loading').style.display = "none";
</script>
</body>
</html>

così dovrebbe funzionare....nn l'ho testato...l'ho fatto al volo!

cali1981

mmm non sembra andare... Il div lo fa vedere solo quando l'intera pagina è caricata, invece a me servirebbe farla vedere subito...

cali1981

Quello che intendo io è qualcosa tipo quella che viene fatta su expedia (e molti siti simili) quando si cerca un volo/albergo/ecc, nessuno ha idea?

skyline

metti un <?php flush(); ?> che ti mostra tutto quello ceh ha già caricato

prima che fai la ricerca, la query o quel che è metti la pagina "temporanea" e poi flush() il gioco è fatto

cali1981

Ci ho provato, ho fatto qualcosa di simile al codice postato sopra e poi messo un flush ma non va...

skyline

il codice che hai messo prima non ci va...
scrivi all'inizio dopo <body> pagina temporanea <?php flush(); ?> e poi il resto

cali1981

I problema è che uso smarty, e non credo di poter mettere roba dentro body prima di fare il resto. Cioè, io ho un template smarty, dentro il template richiamo la funzione che cerca e poi quando questa restituisce il codice html faccio visualizzare il template di smarty, quindi mi sa difficile metterlo dopo body... Prima di html verrebbe scartato?

skyline

prima di html fa schifo. ma quanto ci mette a fare la query?

cali1981

qualche secondo. Fa schifo che vuol dire, va o non va? Cmq ad esempio expedia lo mette prima dell'HTML....

skyline

si ma non è validato a me non piace come sistema.

cali1981

Capisco, ma in alternativa come potrei fare? Sto provando con una popup ma non mi piace e poi con i blocca popup non si vedrebbe...

ceccus

Ciao cali1981,
il segreto è mettere display:block nello style del div. Così la pagina comparirà solo quando il div scomparirà.

per la classe del div usa ad esempio:

#preload {
**visibility: hidden; **
height:50%;
border: 10px dashed #154478;
**width:80%; **
**margin: 0px; **
**margin-top: 100px; **
**padding: 50px; **
font-size:22px;
color: #FF3B00;
**font-weight:bold; **
display:block;
}

per quanto concerne il div, effettivamente prima di tutto il codice html è meglio (dispiace anche a me... lo so... :x):

<div id="preload" style="visibility: visible;">
One moment please...<br><br>
<?php echo $doma2; ?> is searching multiple suppliers for the best deals.<br>
Please wait while we gather your results...<br><br>
<table cellspacing="0" cellpadding="0" border="0">
<tr><td><img src="img/waitingsx.gif" alt="" border="0"></td>
<td><img src="img/waiting.gif" alt="" border="0"></td>
<td><img src="img/waitingdx.gif" alt="" border="0"></td></tr></table>
</div>
</div>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
</html>...

Occhio alla parte in rosso...

Nella pagina web, caricati questo javascript:

var isNav, isIE
if (parseInt(navigator.appVersion) >= 4)
{ if (navigator.appName == "Netscape")
{ isNav = true }
else
{ isIE = true }
}

function hideLayer(layername)
{
if (isNav)
{ document.layers[layername].visibility = 'hidden'; }
else //Must be IE
{document.all[layername].style.visibility = 'hidden';}
}

che ti servirà per nascondere il div a caricamento avvenuto.

Infine, in fondo alla pagina (in modo cioè che sia caricato alla fine) metti:

<img src="p.gif" width="0" height="0" onload="javascript:hideLayer('preload');">

Ovviamente se manca p.gif il div non scompare...

Il tutto appena sfornato per le mie esigenze

Se trovi un'immaginetta di scorrimento carina... postala che serve anche a me...

cali1981

ok provo. Per le immagini prova vedere ajaxload.info

ceccus

Integro e correggo:

Occorre infatti aggiungere il position:absolute nello stile. Inoltre, se lo stile è caricato direttamente nel doc html prima di ogni cosa, si evita la frazione di secondo del div non formattato che si avrebbe se lo stile fosse caricato dopo.

Per la funzione javascript, quella postata sopra mi dava errore con FF, ho sistemato il tutto con un'unica istruzione valida sia su IE6 che su FF:

function hideLayer(layername)
{
document.getElementById(layername).style.visibility = 'hidden';
}

cali1981

Grazie, ora così sembra funzionare! Solo una cosa, senza javascript il sito in pratica non funziona, ma per evitare che utenti senza js vedano il div, potrei metterlo come z-index basso o altri accorgimenti del genere in modo che anche senza eseguire il js non dia fastidio?

ceccus

Effettivamente si potrebbero tentare alcune strade...

Per esempio provare a ridefinire lo stile mettendo un dipslay:none, alla fine della pagina... oppure giocare con gli z-index, ma non ho una precisa idea di ciò che verrà fuori...

Fammi sapere se addivieni a qualcosa di utile!