Dans lequel nous déterminons les problèmes que nous rencontrions pour que la disposition des colonnes se charge correctement. Le correctif consistait à supprimer le CSS qui faisait fonctionner les zones d'espace réservé respectant les proportions une fois l'image chargée (qui conserve les proportions toutes seules). Ensuite, appliquez une classe CSS pour faire fonctionner le «fondu» (en changeant l'opacité de 0 à 1). Du fromage facile et juste une cuillerée de JavaScript.
Il convient de noter que sur la version live du site, malheureusement, cette technique cool ne fonctionnerait pas. Pour que cela soit vraiment efficace, nous devons connaître le rapport hauteur / largeur de l'image côté serveur, nous pouvons créer la grille instantanément avec les bons espaces réservés. Malheureusement, nous ne disposons pas de ces informations dans la vraie galerie. Nous pouvons utiliser PHP pour obtenir les dimensions, mais c'est très lent. Au lieu de cela, nous attendons que toutes les images se chargent, puis disparaissent dans leur opacité. Pas aussi cool et un peu plus lent, mais au moins moins de janky-ness de chargement.
