JS Bilder vorladen anzeigen

Dieses Thema JS Bilder vorladen anzeigen im Forum "Webentwicklung, Hosting & Programmierung" wurde erstellt von AlexD, 25. Feb. 2010.

Thema: JS Bilder vorladen anzeigen Hallo zusammen, ich hab ein kleines Problem. Und zwar hab ich eine kleine Galerie erstellt in der kleine Thumbs...

  1. Hallo zusammen,

    ich hab ein kleines Problem.
    Und zwar hab ich eine kleine Galerie erstellt in der kleine Thumbs angezeigt werden und beim Klicken auf ein Großes wird das entsprechende groß mit einem Fade in -Effekt angezeigt. Um beim anklicken Wartezeiten und nicht funktionierende Fade-in's zu vermeiden, werden die Großen schon beim laden der Seite mit vorgeladen.

    Das Vorladen dauert aber ebenfalls ein paar Sekund die man waren sollte bis man loslegt. Da hab ich mir gedacht, ich lass einfach eine <div>-Box einblenden, in der etwas der art Bilder werden geladen, bitte warten.... und sobald alle Bilder geladen sind, verschwindet diese Box auch wieder.

    hier mal mein Ansatz, der leider nicht funktioniert.
    Ich denke JavaScript schmeißt dem Browser alle Bilder hin, die er zu laden hat und nicht wie ich dachte, das immer erst ein Bild fertig geladen wird und dann ein neuer Schleifendurchgang gestartet wird.

    Code:
    function BilderVorladen()
    {
    
      document.Vorladen = new Array();
      var anzahl = BilderVorladen.arguments.length;
      var t = 0;
      
      document.getElementById(uploadMessage).innerHTML=(<div class=\style_preload\>Bilder werden geladen!!<br><br><img src=\./images/upload.gif\><br><br><strong>Bitte warten...</strong></div>);
    
      if(document.images)
      {
        for(var i = 0; i < BilderVorladen.arguments.length; i++)
        {
    
          document.Vorladen[i] = new Image();
          document.Vorladen[i].src = BilderVorladen.arguments[i];
    
        }
      }
      
      document.getElementById(uploadMessage).style.display='none';
    }
    
    Gibt es denn eine Möglichkeit das zu realisieren??
    Google konnte mir hier leider nicht weiterhelfen! :(

    Besten Gruß
    Alex
     
  2. Hallo Alex,
    nein, das Skript wartet nicht, bis das Bild fertig geladen ist. Es teilt nur dem Browser die Quelle mit und dieser lädt es dann selbständig.
    Man kann aber mit Javascript abfragen, ob ein Bild schon fertig geladen ist: http://de.selfhtml.org/javascript/objekte/images.htm#complete
    Hier ist ein Script mit einem Fortschrittsbalken, wo Du dir ansehen kannst, wie es gehandhabt wird:
    http://www.dynamicdrive.com/dynamicindex4/preloadimage.htm
    Viele Grüße - Ulrich
     
  3. Hallo UlrichBa,

    ich hab mir das schon gedacht, dass das Skript nicht wartet bis ein Bild fertig geladen wurde...

    Hab mir das mal angesehen und ich muss sagen, dass ist genau das was ich suche!!

    Natürlich hab ich mich gleich dran gemacht und versucht es einzubauen, aber nicht in Form eines Links, sondern das eben eine Box eingeblendet wird.
    Und was soll ich sagen, es hat geklappt!! :)

    Getestet in FirFox3.6, IE8, Opera10 und Safari4

    Hier einfach mal das Ergebnis zum ansehen!!
    http://privatwebarea.dyndns.org/pro...main.php?page=galerie&lang=de&seite=1

    Möchte mich sehr herzlich für die Hilfe bedanken!!! :) :1

    Gruß
    Alex
     
Die Seite wird geladen...

JS Bilder vorladen anzeigen - Ähnliche Themen

Forum Datum
Bilder von Karte automatisch ins Netzwerk kopieren. Womit? Software: Empfehlungen, Gesuche & Problemlösungen 2. Okt. 2016
Meine Bilder aus versehen gelöscht Windows 7 Forum 6. Juli 2016
Speicherort für Dokumente, Bilder u.a. festlegen Windows 8 Forum 4. Apr. 2016
Speicherberechtigung für Bilder etc. Windows 10 Forum 19. Aug. 2015
Ordner "Eigene Bilder" wiederherstellen Windows 7 Forum 3. Mai 2015