PhotoTileWall

Demonstration

Demo

Description

A simple & easy to use JS-Library for galleries.

  • Full responsive
  • automatically and nice order of the photos
  • Additional Lightbox
  • additional hover-effects.
  • works with jQuery
  • multiple galleries on one website

Download & Installation

Asap you can find the instructions for downloading the script.

How to use

HTML of your photoTileWall-Website


    <div class="demo-gallery-a">
        <img src="/gallery/image.png" alt="an alternative text">
        <img src="/gallery/image.png" alt="an alternative text">
        <!-- all images comes here -->
    </div>

Initialize the photoTileWall once in your javascript.


    var ptw = new PTW();
                

For each gallery (you can initialize more of them on one page), you can initialize the gallery:


    ptw.initPTW();
                

If you want, you can set some options:


    ptw.initPTW({
        gutterWidth: 24,
        lightbox: {
            setLightbox: true
        },
        hover: true
    });

Options

For an individual use, you can use a lot of options

container

    container: 'photos'  [ string | default: 'photo-tile-wall' ]

The container in which all the photos are listed. Can be class or Id of an element.

gutterWidth

    gutterWidth: 24  [ integer | default: 24 ]

Set the width of the gutter between the images in pixel.