Welcome,

To the worst image gallery, we are so happy that you finally found it. So what are you waiting for? Check it out!

We have added some possibilities to have control over gallery properties when compiling code. For example, you can change the directory or extension, change the auto-play delay time, and choose whether to show buttons or not.

The gallery has auto-play. You can press the space button or just click the play button and watch images all day in full screen. You can move the mouse away from the window, and the buttons will be hidden. Click on the image and auto-play will be stopped.

You can watch images on any display. The gallery adjusts dynamically, utilizing a media query (min-width: 1024px) to hide buttons when you move the mouse cursor away from the browser window, as the gallery takes up the entire window size.

How to include

Download JavaScript file (main.js ~10 KiB) and suggest a suitable file name

Copy/Paste ctrl+a/ctrl+c/ctrl+v to head or before closing body tag

<script defer src ="js/main.js"></script>

  • imageContainer: image gallery - selects all images with given classes. if not set, it selects all images by default.
  • showButtons: show bottom buttons - controls the visibility of bottom buttons (e.g., autoplay and download).
  • folder: folder location for higher resolution images or image prefix - specifies the location for higher resolution images or sets an image prefix.
  • delaySeconds: autoplay delay - sets the duration for displaying each image in autoplay mode.
  • showButtonsOnplay: show buttons during autoplay - determines whether to display buttons during autoplay.
  • extension: extension for higher resolution images - specifies the file extension for higher resolution images.
  • image gallery1
  • image gallery2
  • image gallery3
  • image gallery4
  • image gallery5
  • image gallery6
  • image gallery6