TinyGallery
A simple javascript image gallery.
Installation
From NPM
$ npm install tinygallery
Download from Github or use a CDN
Copy tinygallery.min.css
and tinygallery.min.js
from the /dist folder to your website. Alternatively, you can link to these files hosted on a CDN:
https://raw.githack.com/gyrad/tinygallery/master/dist/tinygallery.min.css
https://raw.githack.com/gyrad/tinygallery/master/dist/tinygallery.min.js
Usage
Include tinygallery.min.css
in the head section of your webpage:
Include tinygallery.min.js
at the bottom of the body of your webpage just before the closing </body>
tag:
Create a list of links to image files with enclosed thumbnails and add them to the body of your webpage. The root div MUST have class="tinygallery"
and also an id
set to a unique name. You can also add the data-caption
attribute to show a caption underneath the image.
Add the following JavaScript code after including the tinygallery script, to initialize the gallery. Change the 'my_main_gallery'
to the id of the div that contains the list of linked images.
<script> const my_gallery = 'my_main_gallery'; my_gallery; // You can also add more than one gallery. const another_gallery = new ; another_gallery;</script>