Home » Javascript » Responsive Image Gallery Plugin – Row Grid

Responsive Image Gallery Plugin – Row Grid

rowGrid is a lightweight jQuery plugin to display images in ordered rows with auto spacing and resizing. It is used to create nice looking image gallery. It helps creating beautifull responsive image gallery with jquery. It also support infinite scrolling of image galleries.

Size is 800 bytes.


The grid is similar to grids on Google Image Search, flickr, shutterstock and Google+ images.


  • responisve
  • infinite scrolling

Download : https://github.com/brunjo/rowGrid.js/zipball/master



Include jquery and the plugin into the webpage.

<script src="path/to/jquery.min.js" >
<script src="path/to/jquery.row-grid.min.js" >



    <img src="path/to/image" width="120" height="100" />
    <img src="path/to/image" width="130" height="100" />


.container {
  background: #eee;
/* clearfix */
.container:after {
    content: "";
    display: table;
.container:after {
    clear: both;

.item {
  float: left;
  margin-bottom: 10px; 
.item img {
  max-width: 100%;
  max-height: 100%;
  vertical-align: bottom;
.first-item {
  clear: both;
/* remove margin bottom on last row */
.last-row, .last-row ~ .item {
  margin-bottom: 0;


$(document).ready(function() {
  var options = {minMargin: 5, maxMargin: 15, itemSelector: ".item", firstItemClass: "first-item"};

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.