Best jQuery Gallery Plugins & Tutorials with Demo

Grid Reveal Effects with Anime.js

Grid Reveal Effects with Anime.js

Some experiments with the new staggering system of Anime.js where we try different effects for hiding and showing thumbnails in an image grid.

Recently, a new version of anime.js was released. One of the great new features is its staggering system that makes complex follow through and overlapping animations really simple. We wanted to give it a try and experiment with this new feature on an image grid with many thumbnails.

Ajaxable : Make your forms Instantly Ajaxable

Ajaxable : Make your forms Instantly Ajaxable

This library simply takes the standard HTML forms as an input and make them send requests via AJAX keeping HTML5 validations.

Instagram Feed – jQuery Plugin to Embed Instagram Photos

Instagram Feed - jQuery Plugin to Embed Instagram Photos

This jQuery Plugin allows you to embed Instagram Feed of Instagram users into your sites. Moreover, this plugin is responsive and includes many options to customize the photos, buttons, etc.

SampGallery : Simple jQuery Image Previewer

SampGallery : Simple jQuery Image Previewer

SampGallery is a simple jQuery image previewer gallery.

Fullscreen Hover Loop Effect with CSS & TweenMax

Fullscreen Hover Loop Effect with CSS & TweenMax

Today we’d like to share a little artsy effect with you. The idea is to show a fast fullscreen preview of images when hovering over a special link. In our demo we use the concept of a photographer’s website where the link to their works triggers the effect. On hover, some photos are shown rapidly in a loop. Once the link is clicked, the current image scales down and moves to its place in the grid. The animations are made using TweenMax.

Grid Layout with Scrollable Content View

Grid Layout with Scrollable Content View

Today we’d like to share a Masonry-powered grid layout with you that has a motion hover effect on the items and a content preview that is scrollable. Once a grid item is clicked, we animate the image to the center of the page and scale it up. The background of the item also scales up, filling the whole page and forming the new background of the content preview. The content preview is scrollable, with some more text showing beneath the image. The animations are powered by TweenMax.

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.