<div id="photos">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/12/public-domain-images-free-stock-photos-high-quality-resolution-downloads-public-domain-archive-10-1000x750-160436_1000x675.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/12/public-domain-images-free-stock-photos-high-quality-resolution-downloads-public-domain-archive-3-1000x750-170064_1000x675.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/09/public-domain-images-free-stock-photos-palma-fruits-sun-apartments-white-building-1000x673.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/09/public-domain-images-free-stock-photos-light-sky-silo-windows-lillyphotographer-1000x668.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/09/public-domain-images-free-stock-photos-flower-ball-1000x718-104981_1000x675.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/09/public-domain-images-free-stock-photo-loft-stair-653x1000-91658_653x675.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/03/public-domain-images-archive-high-quality-resolution-free-download-0036-1080x675.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/03/public-domain-images-free-high-quality-resolution-downloads-30-1080x675.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/02/public-domain-images-archive-free-download-24-1080x675.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/10/public-domain-images-free-stock-photos-high-quality-resolution-downloads-nashville-tennessee-12-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/10/public-domain-images-free-stock-photos-high-quality-resolution-downloads-nashville-tennessee-6-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/08/public-domain-images-free-stock-photos-vintage-kids-toys-books-fisherprice-1-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/08/public-domain-images-free-stock-photos-vintage-book-childrens-thumbelina-illustrations-floral-1.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/08/public-domain-images-free-stock-photos-porcelain-figure-vintage-british-17thcentury-style-1-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/08/public-domain-images-free-stock-photos-old-books-vintage-brown-red-1-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2015/01/reclaimed-wood-furniture-farm-table-sons-of-sawdust-12-1000x667.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/12/public-domain-images-free-stock-photos-high-quality-resolution-downloads-public-domain-archive-19-1000x667.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/12/public-domain-images-free-stock-photos-high-quality-resolution-downloads-public-domain-archive-18-1000x750-159345_1000x675.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/12/public-domain-images-free-stock-photos-high-quality-resolution-downloads-public-domain-archive-16-1000x750-225701_1000x675.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/12/public-domain-images-free-stock-photos-high-quality-resolution-downloads-public-domain-archive-15-1000x667.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/12/public-domain-images-free-stock-photos-high-quality-resolution-downloads-public-domain-archive-14-1000x667.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/12/public-domain-images-free-stock-photos-high-quality-resolution-downloads-public-domain-archive-13-750x1000-126745_750x675.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/10/public-domain-images-archive-free-stock-photos-6-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/10/public-domain-images-archive-free-stock-photos-5-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/10/public-domain-images-archive-free-stock-photos-4-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/10/public-domain-images-archive-free-stock-photos-3-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/10/public-domain-images-archive-free-stock-photos-2-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/09/public-domain-images-free-stock-photo-ice-north-pole-g-1000x653.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/09/public-domain-images-free-stock-photos-aureliejouan-lights-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/09/public-domain-images-free-stock-photos-aureliejouan-flowers-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/08/public-domain-images-free-stock-photos-shoes-feet-walking-rocks-creek-1-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/08/public-domain-images-free-stock-photos-little-girl-child-reading-book-bedtime-nap-11-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/08/public-domain-images-free-stock-photos-vintage-kids-toys-books-fisherprice-1-1000x666.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/06/public-domain-images-free-stock-photos-high-quality-resolution-downloads-unsplash0068-1000x658.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/06/public-domain-images-free-stock-photos-high-quality-resolution-downloads-unsplash0074-1000x664.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/06/public-domain-images-free-stock-photos-high-quality-resolution-downloads-unsplash0066-685x1000-211378_685x675.jpg">
  <img src="http://publicdomainarchive.com/wp-content/uploads/2014/05/public-domain-images-free-stock-photos-shoes-walking-feet-grey-gravel--1000x666.jpg">
</div>
body {
  margin: 0;
}
var grid = new Grid({
  element: '#photos',
  columns: 6,
  margin: 2
});

window.addEventListener('load', function() {
  grid.items[0].spanX = 3;
  grid.items[0].spanY = 2;
  grid.items[5].spanX = 2;
  grid.items[5].spanY = 3;
  grid.draw();
}, false);
Run Pen

External CSS

  1. https://cdn.rawgit.com/jimoong/mosaigrid/master/css/grid.css

External JavaScript

  1. https://cdn.rawgit.com/jimoong/mosaigrid/master/js/grid.js