Galerie en grille mosaïque avec des images de taille dynamique

Question

Je viens de recevoir le design suivant pour un projet, pour une galerie de grille d'images, avec des images dynamiques en largeur et en hauteur (images soumises par l'utilisateur). (Capture d'écran à la fin du post)

J'ai essayé jQuery Masonry , Tympanus Montage automatique d'images y Grille de photos CSS-Tricks Seemless Responsive mais chacun a ses limites.

• Jquery Masonry permet de dynamiser à la fois la largeur et la hauteur, mais des lacunes sont générées.
• Les deux derniers scripts génèrent de très belles grilles, mais avec le problème que la largeur ou la hauteur doivent être statiques.

EDITAR: Je suis tombé sur, Isotope Je vais probablement finir par l'utiliser, à moins qu'il n'y ait quelque chose qui réponde exactement à mes besoins. Par conséquent, ma question reste toujours la même...

Existe-t-il un script javascript (de préférence jQuery) capable de générer une mosaïque complètement dynamique (par rapport à la taille de l'image), comme celle de la capture d'écran ci-dessous ?

Merci pour toute aide

---

Answer 1

Je propose Freewall . Il s'agit d'un plugin jQuery cross-browser et responsive pour vous aider à créer de nombreux types de mises en page en grille : mises en page flexibles, mises en page d'images, mises en page en grille imbriquées, mises en page de style métro, mises en page de type Pinterest ... avec de beaux effets d'animation CSS3 et des événements de rappel. Freewall est une solution tout-en-un pour créer des mises en page dynamiques en grille pour les ordinateurs de bureau, les mobiles et les tablettes.

Page d'accueil et document : également trouvés here .

Answer 2

Il y a codecanyon.net/item/jquery-tiles-gallery/2281417 qui n'est pas aussi intelligent qu'Isotope, mais qui redimensionne/coupe les images de façon à ce qu'elles remplissent toujours un rectangle comme le suggère votre capture d'écran. Peut-être qu'il peut être amélioré pour fonctionner mieux et sans les effets de survol qui ne fonctionnent pas sur les écrans tactiles des smartphones et des tablettes.

Answer 3

Je pense que vous pouvez essayer "Galerie Google Grid" Il est basé sur la maçonnerie susmentionnée avec quelques ajouts, comme les styles et le visualiseur.