Final Tiles Gallery
It’s a jQuery plugin that can build a responsive tiled gallery. The algorithm is able to place images in a grid without spaces between the tiles Its main feature consists of keeping the aspect ratio of the images, so it doesn’t crop them . An interesting feature is the snapping grid. The snapping grid is a solution to increase the chance of having aligned tiles, but what does it mean “aligned tiles”? Look these images:
|Without snapping grid||With snapping grid|
The example on the left show what happens without a snapping grid: tiles tend to arrange in a multi-column layout, like Pinterest, to be clear. The image on the right shows what happens using a constraint on the size of the images: they tend to be aligned, building much more interesting layouts. It’s possible to obtain a great variety of grids just playing with parameters like: margin (between tiles), minimum tile width and the size of the snapping grid.
An example of this plugin:
The aim of Tiles Gallery is to completely fill an area with images, without spaces between them. While Final Tiles Gallery grows vertically, Tiles Gallery always fill the desired area, so you can decide the size of the gallery nevertheless how any images it contains. This gallery is, however, responsive so, it adapts to its container width if this changes.
To achieve this result, the gallery must crop the images, actually it’s a smart crop, that is you can decide what part of the image can be cropped. Also consider that the grid generated by this gallery is always random. Here is an example of this plugin: