#052: Smooth Loading Gallery, Teil 2

In dem wir die Probleme lösen, die wir hatten, um das Spaltenlayout schön laden zu lassen. Die Lösung bestand darin, das CSS zu entfernen, das die seitenverhältnisgetreuen Platzhalterboxen beim Laden des Bildes funktionieren ließ (die das Seitenverhältnis von selbst beibehalten). Dann wird eine CSS-Klasse angewendet, um das "Einblenden" zu ermöglichen (Änderung der Deckkraft von 0 auf 1). Kinderleicht und nur ein Löffelchen JavaScript.

Es sollte angemerkt werden, dass auf der Live-Version der Seite diese coole Technik leider nicht funktionieren würde. Damit sie wirklich effektiv ist, müssten wir das Seitenverhältnis des Bildes serverseitig kennen, damit wir das Gitter sofort mit den richtigen Platzhaltern erstellen können. Leider stehen uns diese Informationen in der echten Galerie nicht zur Verfügung. Wir könnten PHP verwenden, um die Abmessungen zu ermitteln, aber das ist sehr langsam. Stattdessen warten wir, bis alle Bilder geladen sind, und blenden dann deren Deckkraft ein. Nicht ganz so cool und etwas langsamer, aber zumindest weniger Ruckeleien beim Laden.