Best jQuery Gallery Plugins & Tutorials with Demo

    Stratum.js : jQuery Masonry Grid Library

    Stratum.js : jQuery Masonry Grid Library

    Stratum.js is a small jQuery plugin for creating awesome masonry grid.

    Galpop : jQuery Image Gallery Plugin

    Galpop : jQuery Image Gallery Plugin

    Galpop is a jQuery plugin that creates image galleries. It can be controlled with the left and right arrow keys and automatically resizes with your browser.

    Features:

    • Resizes with your browser
    • Can use arrow keys for controls
    • Callbacks after every image is loaded
    • Backgrounds and borders can be easily changed with CSS

    Tobi : Simple Lightbox script without Dependencies

    Tobi : Simple Lightbox script without Dependencies

    Tobi is a simple lightbox script without dependencies.

    Features:

    • No dependencies
    • Simple and light-weight
    • Keyboard support: Prev/Next keys allows to navigate through items, close the lightbox with the escape key
    • Touch gestures: Drag/Swipe to navigate through items, close the lightbox with a vertical drag/swipe

    Natural Gallery : A Natual Layout List Gallery

    Natural Gallery : A Natual Layout List Gallery

    Natural-Gallery is a lazy load, infinite scroll and natural layout list gallery.

    Full Image Reveal Effect with TweenMax Animation

    Full Image Reveal Effect with TweenMax Animation

    Today we’d like to share a simple fullscreen image reveal effect with you. The idea is to have an inital thumbnails layout at the bottom of the page and then animate the items when we click them. A covering element comes sliding in and when it moves out, the fullscreen image view is shown behind. We are using TweenMax for the animations.

    Grid Layout with Motion Hover Effect and Content Preview

    Grid Layout with Motion Hover Effect and Content Preview

    Today we’d like to share a little grid layout with you. We use CSS Grid and a playful hover effect on the grid items which are composed of different wildly placed elements. When an item is clicked, we slide in a content preview overlay and animate the grid items out and the preview items in. For the animations we use TweenMax by Greensock.

    slideBox.js : jQuery Responsive lightbox-style media Galleries & Carousels

    slideBox.js : jQuery Responsive lightbox-style media Galleries & Carousels

    slideBox is a jQuery plugin for easy creation of responsive lightbox-style media galleries and carousels. Features:

    • Groups together your media in a lightbox-style gallery or carousel.
    • Autorotating carousels.
    • Carousel pager support.
    • CSS transitions.
    • Basic UI included.
    • Lazyloads images and video through lazysizes.js.

    jQuery – Facebook,YouTube,Vimeo,Twitter,Instagram Social Stream Grid

    jQuery - Facebook,YouTube,Vimeo,Twitter,Instagram Social Stream Grid
    • Responsive Design Layouts.
    • 6 Style Available
    • Inline Social read popup
    • Inline Only image popup
    • Custom Columns Layout
    • Custom backgrond Color and hover background color
    • Fitrow and Masonry Grid Layout
    • Show more Pagination
    • Multi Filtering
    • Social Share icon for each post in popup
    • 60+ animation effects

    Nice Gallery : jQuery neat Image Gallery Plugin

    Nice Gallery : jQuery neat Image Gallery Plugin

    Nice Gallery is a neat image gallery plugin for jQuery. It offers different possible configurations while still being lightweight and easy to work with.

    MasonGram : jQuery Instagram feed Plugin

    MasonGram : jQuery Instagram feed Plugin

    MasonGram is a jQuery plugin to add Instagram feed to a page.

    Features:

    • Simple
    • Responsive
    • Infinite loading while scrolling down
    • Link to a location on map (configurable either via caption text @12.34,56.78 or via image location tag)
    • Configurable image caption with “caption”, “location”, “likes”