Greybox Gallery / Thumbnail Problem

[diggity]

Hallo Leute,

Ich habe ein Problem mit der Greybox, genauer gesagt habe ich eine Bildergalerie mit Thumbnail Seiten.

Jetzt ist es so, dass die Thumbnails ja erst geladen werden wenn man zB eine Seite weiter klickt. Wenn man nun auf ein Thumb klickt (und die Seite noch nicht fertig geladen ist), geht das Bild nicht in der Greybox sondern normal auf.
Das liegt vermutlich daran dass die Greybox noch nicht fertig war mit dem initialisieren und quasi noch nicht "ready" war. Dieses Problem tritt bei langsamen PCs leichter und öfter auf als bei schnellen hab ich bemerkt.

Gibts da irgend eine Lösung?
Momentan blende ich für ca 2 Sekunden einen Overlay-Div ein, der einen vorzeitigen Klick auf ein Bild verhindert, allerdings kommt es auch so vor dass der Div nach der (fix) eingestellten Zeit verschwindet und die Thumbs noch nicht fertig geladen / die Greybox noch nicht initialisiert ist.
Kann ich es irgendwie so machen dass der Div erst verschwindet wenn wirklich alles "ready" ist, oder gibt es überhaupt eine andere Lösung?
$(document).ready() ist ja bereits true _bevor_ sich die Greybox die Gallery zusammengebaut hat...
Kann man mit jQuery feststellen ob wirklich schon alles fertig initialisiert wurde? Hauptsächlich wird es ja um jQuery selbst und die Greybox.js gehen.

Ich glaube ich bin nicht der einzige der mit diesem Problem kämpft, bin um jeden Ratschlag dankbar

 

[xX Hardy Xx]

Also mir würden da 2 Möglichkeiten einfallen.

1. Du lädst die Bilder auf der vorherigen Seite schon in den Cache.

var Grafik1 = new Image();
Grafik1.src = "url_erstes_bild";

var Grafik2 = new Image();
Grafik2.src = "url_zweites_bild";

usw.

Auf der Seite wo sie gebraucht werden gibst du ganz normal die URL der Bilder an.

2. document.images.complete

mehr Info dazu http://de.selfhtml.org/javascript/objekte/images.htm#complete

 

[diggity]

Das sind gute Lösungs ansätze, allerdings funktioniert das in meinem Fall auc´h nicht so super.

Ich hätte jetzt alle Bilder bzw Thumbs (sind bei dieser Testgallery ca 170) auf der ersten Seite der Thumbnail Ansicht preloaded. Das preloaden an sich funktioniert auch wunderbar, wenn man dann auf die 2. Seite klickt ist sofort alles da.

Mein Problem besteht jetzt darin, dass das Laden der ersten Seite sehr lange dauert, und auch wenn alle Thumbnails der ersten Seite schon fertig geladen sind und die Seite an sich fertiog aussieht, lädt das JS die übrigen Bilder noch nach. Wenn man jetzt auf ein Thumb klickt geht das wieder nicht in der Greybox sondern normal auf. Erst wenn das JS alles fertiggeladen hat lässt es sich in der Greybox öffnen.

Tja, "machst einfach ein Overlay mit einer Ladegrafik auf der ersten Seite" hab ich mir gedacht, hier habe ich dann jedoch das Problem dass ich das Overlay nicht schließen kann wenn die Bilder fertig geladen sind.
Dann wollte ich es mit document.images.complete versuchen, klappt aber nicht:

$.blockUI();		
var img_total = document.images.length;		  
if(document.images[img_total-1].complete == true) {
    $.unblockUI();
}

Hab natürlich alle Bilder mit visibility hidden in das Dokument eingebunden damit ich so darauf zugreifen kann.
er führt mir das unblockUI einfach nicht aus wenn er fertig ist.

 

[xX Hardy Xx]

Also ich bin icht so der Crack in JS deswegen kenne ich die Notation $. zum aufrufen eine funktion garnicht. Muss ich aber auch nicht, ohne Funktioniert es auch

170 Bilder (Thumbnails) pro Seite finde ich ein bischen viel. Nimmst du weniger wird auch die Ladezeit kürzer.

Je nach dem wo du die Überprüfung machst

$.blockUI();		
var img_total = document.images.length;		  
if(document.images[img_total-1].complete == true) {
    $.unblockUI();
}

kann die Anzahl der Bilder noch garnicht ermittelt werden. Sie gehört auf alle Fälle an das Ende. Damit meine ich nach dem HTML Code für die Bilder. Ich weiß nicht wo du die Überprüfung gemacht hast.

Also ich weiß im Moment nicht, wie ich dir weiterhelfen kann, es gibt hier schon einige die haben JS besser drauf, ich hoffe das sie dir helfen können. Sollte mir mal eine Lösung unterkommen, werde ich bescheid sagen.

 

[diggity]

Es sind ja nicht 170 Bilder pro Seite, es sind 170 Bilder insgesamt die ich dann preloade. Pro Seite werden nur ca. 30 angezeigt.

Die JS Funktion zum Zählen rufe ich ganz unten im Src auf, also bevor sich der body schließt.

Momentan hab ich einfach eine Sperre von 2.5 Sekunden drin, somit kann ich wenigstens den "Regelfall" umgehn und zumindest die Leute mit halbwegs schnellem Internet und schnellen PCs werden keine Probleme haben (hoffentlich)

Echt ärgerlich das Ganze...