Mosaic Gallery effect with jQuery or CSS?

Question

I'd like to achieve this Mosaic(?) effect but I'm unsure where to begin. Is there a plugin I can use?

Here is my current code: https://jsfiddle.net/z3bhh9gj/

<section id="intro">
        <div class="container">
            <div class="row">
                <div class="item">
                    <img src="http://placehold.it/300x620">
                </div>
                <div class="item">
                    <img src="http://placehold.it/620x300">
                </div>
                <div class="item">
                    <img src="http://placehold.it/300x300">
                </div>
                <div class="item">
                    <img src="http://placehold.it/300x620">
                </div>
                <div class="item">
                    <img src="http://placehold.it/300x300">
                </div>
                <div class="item">
                    <img src="http://placehold.it/300x300">
                </div>
            </div>
        </div>
    </section>

Here is what the final outcome should look like:

Should I be looking at Masonry or Isotope for this?

Appreciate any help :-)

This can be helpfull: [Mosaic of images HTML/CSS](http://stackoverflow.com/questions/22221333/mosaic-of-images-html-css) — web-tiki, Jan 26 '16 at 14:50
You're asking for specific tools, for which Stack Overflow isn't the best place. — , Jan 26 '16 at 14:53

score 1 · Accepted Answer · answered Jan 26 '16 at 14:40

1

You have nice plugin for that

answered Jan 26 '16 at 14:40

Goran Hrustić

81
1
7

GridALicious looks the ticket - thank you, Goran! – michaelmcgurk Jan 26 '16 at 15:31

score -1 · Answer 2 · answered Jan 26 '16 at 14:41

-1

Masonry is a layout and Isotope is a plugin that provides masonry layout and filtering and more. There is a masonry plugin:

Masonry

Isotope uses this library.

Isotope

answered Jan 26 '16 at 14:41

Maverick

876
2
12
22

Mosaic Gallery effect with jQuery or CSS?

2 Answers2