Accedi per seguire   
Seguaci 0
Opp85

Loader Animato (gif)

9 messaggi in questa discussione

Alcune pagine del mio sito devono visualizzare diverse immagini.

Come posso visualizzare una gif animata durante il caricamento dell'immagine?

Serve Ajax? O esiste qualche metodo più semplice?

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

sarò abbastanza ignorante di javascript e / o Ajax ma mi sembrano un pò troppo complicati... E' l'unico modo?

A "occhio" sembra possa essere semplice...(deve solo mostrare un'immagine finchè non ne viene caricata un'altra...)

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

è una funzione di preload quella.. e la devi realizzare in javascript.

Ti assicuro che integrare quel codice è molto più facile, che andare a realizzare lo script di preload :)

Scarichi il file JS già realizzato, e nelle tue pagine web, gli inserisci il link nell'intestazione e gli attribuisci la classe sulla quale l'effetto deve agire.. ed il gioco è fatto

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Dopo essermi guardato un pò le librerie jQuery ho cercato di trovare una soluzione più semplice...

ecco il codice:

Tra gli head:

<script type="text/javascript">
  function carica(imgid,immagine) {
  document.getElementById(imgid).setAttribute('src',immagine);
  }
  </script>

e poi nel body:

   <img id="1" onload="carica('1','images/1.jpg')" src="immagini/circle.gif" />
  <img id="2" onload="carica('2','images/2.jpg')" src="immagini/circle.gif" />
  <img id="3" onload="carica('3','images/3.jpg')" src="immagini/circle.gif" />

Funziona tutto alla perfezione, ma la pagina sembra continui a caricare qualcosa... e in effetti se la apro con IE6 nella barra di stato in basso appare la scritta (4 elementi rimanenti)... oppure mi dà delle alert del tipo: Stack overflow at line 0...

Quale potrebbe essere la soluzione?

E' tutto errato ciò che ho fatto?

Grazie mille...

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

In realtà la pagina continua a caricarsi perchè la funzione espressa nell'evento onload si deve verificare quando l'oggetto è stato interamente caricato.

Il problema deriva dall'evento onload. Dovresti cercare di evitare di utilizzare quel codice e magari far sostituire il src dell'immagine direttamente dalla funzione javascript, dopo che ha caricato l'immagine.

Discussione Spostata nella sezione Javascript.

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti
Il problema deriva dall'evento onload. Dovresti cercare di evitare di utilizzare quel codice e magari far sostituire il src dell'immagine direttamente dalla funzione javascript, dopo che ha caricato l'immagine.

Quale potrebbe essere il codice corretto?

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

purtroppo la realizzazione di uno script simil Ajax non è cosa facilissima :P

ti posto la mia soluzione, che è forse un po' macchinosa (scrivendoti al volo in pausa pranzo non ho la possibilità di testarla :) )

Io farei:

Tra gli head:

<script type="text/javascript">
function carica() {
document.getElementById(id1).innerHTML="<img src='images/nomeimg1.jpg' />";
  document.getElementById(id2).innerHTML="<img src='images/nomeimg2.jpg' />";

}
</script>

modificherei il tag body come:

<body onload="carica()">

e poi nel body:

<div id="id1"><img src="immagini/circle.gif" /></div>
<div id="id2"><img src="immagini/circle.gif" /></div>
<div id="id3"><img src="immagini/circle.gif" /></div>

per ottimizzarlo, se hai tante immagini da precaricare, ti puoi creare un array con l'elenco delle varie immagini ed immettere id con numeri progressivi, in modo che li puoi aumentare con una variabile :P

Condividi questo messaggio


Link di questo messaggio
Condividi su altri siti

Crea un account o accedi per lasciare un commento

Devi essere un utente registrato per partecipare

Crea un account

Iscriviti per un nuovo account nella nostra community. È facile!


Registra un nuovo account

Accedi

Sei già registrato? Accedi qui.


Accedi Ora
Accedi per seguire   
Seguaci 0