jQuery Gallery Plugin & Tutorials with Example

jQuery JustifyGallery Plugin

jQuery JustifyGallery Plugin

A jQuery plugin to justify your Gallery.

jQuery Portfolio Gallery Tree

jQuery Portfolio Gallery Tree

It’s a gallery tree plugin that means every gallery can have one or more sub galleries. It’s perfectly suitable for portfolio gallery. It’s fully responsive and also usable for other purposes like navigation, galleries etc.

Features :

  • Flat UI.
  • Supported by all major browsers.
  • Responsive design.
  • 5 layouts included.
  • Own layout can be customized.
  • Almost fully css customizable.
  • Metro and iOS7 inspired.

MixItUp 2 : jQuery Animated Filtering & Sorting Plugin

MixItUp 2 : jQuery Animated Filtering & Sorting Plugin

MixItUp is a jQuery plugin providing animated filtering and sorting.

MixItUp is great for managing any categorized or ordered content like portfolios, galleries and blogs, but can also function as a powerful tool for engaging application UI and data-visualisation.MixItUp plays nice with your existing HTML and CSS, making it a great choice for responsive layouts.

Rather than using absolute positioning to control layout, MixItUp is designed to work with your existing inline-flow layout. Want to use percentages, media queries, inline-block, or even flex box? No problem!

MagicWall : jQuery Responsive Image Grid Plugin

MagicWall : jQuery Responsive Image Grid Plugin

MagicWall is a jQuery plugin for creating an image grid that cycles through a set of images using attractive animations at a specific time interval. You can use this plugin to create a decorative element of your website, display your work or simply use it as a nice animated background. MagicWall plugin converts a list of images into a grid with defined number of rows and columns. The remaining images will appear with different animations and delays.

Features:

  • Responsive grid
  • Hardware Accelerated
  • Fullwidth layout
  • Fullscreen layout
  • Highly customizable
  • 22 Animations
  • Sass files included
  • Small file size

jQuery lightGallery Plugin

jQuery lightGallery Plugin

jQuery lightGallery is a lightweight jQuery lightbox gallery for displaying image and video gallery.

Features:

  • Responsive layout.
  • Touch support for mobile devices.
  • CSS transitions with jQuery fallback.
  • Youtube Vimeo Video Support.
  • Slide and Fade Effects.
  • Chrome, Safari, Firefox, Opera, IE7+, IOS, Android, windows phone.
  • Image captions and descriptions.
  • Multiple sliders on the same page.
  • Easily customizable via CSS and Settings.
  • Lightweight (8kb) (minified).
  • Thumbnail support.
  • Separate images for mobile devices
  • Can be extended with callbacks
  • Smart image preloading and code optimization
  • Keyboard Navigation for desktop
  • Font icon support

CSS3 3D Grid Effect

CSS3 3D Grid Effect

Today we’d like to share a little animation concept with you. It’s the recreation of an effect we spotted in this fantastic prototype app by Marcus Eckert. The idea is to rotate a grid item in 3D, expand it into fullscreen and reveal some content. For our attempt to imitate the app behavior, we created two demos. In the first one we rotate the grid item vertically and in the second one horizontally.

bootFolio – jQuery Most Lightweight Portfolio Filtering

bootFolio - jQuery Most Lightweight Portfolio Filtering

bootFolio is the most lightweight (1.59KB) portfolio filtering jQuery script with css3 animation. it is highly optimize for bootstrap, and very easy to use.

Features:

  • World most lightweight script for portfolio filtering (1.59KB)
  • Pure CSS3 transition, transform and animation
  • PrettyPhoto integrations
  • Very easy to use
  • Highly optimize for/with Bootstrap
  • Responsive/fluid/elastic supported

Google Grid Gallery with CSS3 & JavaScript

Google Grid Gallery with CSS3 & JavaScript

A responsive Masonry grid with a gallery view using 3D Transforms. Based on the gallery seen on the Chromebook Getting Started guide by Google.

This Blueprint is a responsive grid gallery based on the gallery by Google for the Chromebook Getting Started guide. In this Blueprint we use Masonry for the grid and 3D transforms for navigating the items. For smaller screens we have some example media queries that adjust the grid layout and also the gallery view.

500px Gallery – jQuery WordPress plugin

500px Gallery - jQuery Wordpress plugin

Display easily your photos from 500px on your website with this simple to use and responsive plugin for WordPress. Display your photos from 500px or a selection of photo streams from 500px ( popular photos, fresh photos… ) with the power of the 500px API ( 500px API key required ). Display your photos in your sidebar, with a widget or in your posts/pages with an easy to use shortcodes generator.

Features:

  • Easy to use shortcode generator
  • Display All your photos with integration of a loadMore button
  • Display multiple 500px photo streams:
    • User: photos, Favorites photos,Friends photos,Friends List,Followers List
    • 500px: Popular photos,Upcoming photos,Editors’ choice photos,photos in Fresh today,photos in Fresh yesterday,photos in Fresh week,Tag
  • Sort photos by time of upload, original date, rating, favorites count etc…
  • Filter images by category
  • Filter 500px photo stream with a custom tag
  • Display your gallery with multiple layouts: images grid, carousel or slider
  • Customize appearance of your gallery: count, columns number, margin etc…
  • Easy to use widget with customizable layout: images grid or slider
  • Uses caching for faster page loading and reduce expensive 500px API-calls
  • Multiple image size in the image grid: square or auto-height
  • Lightbox integration
  • Two type of images captions
  • Create multiple galleries in the same post/page with different parameters
  • customize easily the color of the buttons ( loadMore, filters ) with a color picker
  • Fully responsive

FILo : Facebook Image Loader jQuery Plugin

FILo : Facebook Image Loader jQuery Plugin

FILo is a lightweight and free plugin for the JavaScript framework jQuery for embedding pictures from your facebook site into your own website without writing one line of JavaScript-code.



Best jQuery websites design awards