Best jQuery Gallery Plugins & Tutorials with Demo

    ZoomFolio : jQuery Portfolio Plugin

    April 28, 2013 | CSS2 / CSS3.0, Gallery, Plugins, Premium, Responsive
    ZoomFolio : jQuery Portfolio Plugin

    DZS ZoomFolio is the ultimate plugin for displaying your creative portfolio to your clients and that’s not all. You can use it to show the recent posts from your blog or a gallery from your vacation. The possibilities are endless.

    Features:

    • easy to install – install and get this plugin ready in less then one minutes.
    • responsive – looks great from mobile to HD
    • CSS3 technology – this gallery uses cutting-edge css3 definitions to render awesome 3D effects in supporting browsers, the others will degrade gracefully
    • compatible with all major browsers, including IE – compatible from IE7 to IE10, Chrome, Safari and Firefox
    • SEO friendly – built with search engine optimization on mind from the ground up, the ZoomFolio portfolio uses non hidden valid html markup to build the widget
    • iPhone / iPad optimized – this gallery has been optimized for Apple touch devices
    • Android optimized – this component has been tested on Android 4.0 and works awesome
    Read More Demo

    Pimax : Show Picasa/G+ albums and images on your website – jQuery plugin

    April 16, 2013 | Gallery, Other API, Plugins
    Pimax : Show Picasa/G+ albums and images on your website - jQuery plugin

    Pimax displays a photo gallery from your Picasa/G+ albums. The Public albums are pulled from your account and dsiplayed on your website. You can add a public album or add some images to your G+ account; it will be reflected on your website with this plugin!

    You can also add tabs in Pimax for a specific albums you want to highlight. (Like I have a tab for “cH Best” album in my live demo!)

    Read More Demo

    Rondell : jQuery plugin for Displaying Images in a nice way

    April 12, 2013 | Carousel, Gallery, Plugins, Slider
    Rondell : jQuery plugin for Displaying Images in a nice way

    This is a jQuery plugin for displaying galeries and other content the way you want.Checkout the different presets in the upper menu! Especially the Gallery and Thumbnails preset.

    The rondell demos can be controlled with your keyboard, by clicking the controls or by clicking the rondell items.Touching items and swiping on a phone or tablet computer will work too!

    The plugin has been tested with and should work fine with: IE 7-9, Firefox 3.6+, Chrome, Safari 4+, Opera 11+

    Read More Demo

    kGallery : jQuery thumbnail slideshow Gallery Plugin

    April 12, 2013 | Gallery, jSON, Plugins, Slider, XML
    kGallery : jQuery thumbnail slideshow Gallery Plugin

    kGallery is a gallery written on JavaScript using jQuery library.Advantage of this gallery is ability to work stable with hundreds of pictures or with big pictures, without freezing brouser. This effect is achieved by retrieving the list of images from external source (JSON or XML) and downloading pictures gradually until slideshow is playing, not all in ones.

    Nearest analog is dojox.image.Gallery (dojox.image.ThumbnailPicker+dojox.image.SlideShow), however kGallery do not need to download dozens of JavaScript files with megabytes of code of dojo library.

    Read More Demo

    jQuery Photoset Grid

    April 5, 2013 | Gallery, Plugins
    jQuery Photoset Grid

    A simple jQuery plugin to arrange images into a flexible grid, based on Tumblr’s photoset feature. Originally the plugin was created for our Style Hatch Tumblr themes as a way to use the photoset grid in responsive layouts, but we have since expanded it for use outside of the themes.

    Read More Demo

    jQuery CSS3 App Showcase with Grid Overlay

    April 2, 2013 | Animation, CSS2 / CSS3.0, Gallery
    jQuery CSS3 App Showcase with Grid Overlay

    Today we will be creating a little app showcase with a neat effect in jQuery and CSS3. The idea is to show a mobile device with a screenshot of an app and when clicking on the device, a grid appears, showing some more screenshots. The effect is very subtle: the device moves back and the grid fades in and scales up. When clicking on another screenshot, the device image gets updated and the grid disappears again.

    Read More Demo

    jQuery Real 3D Cloud Gallery/Tags/Menu

    March 31, 2013 | Animation, Gallery, Plugins, Premium
    jQuery Real 3D Cloud Gallery/Tags/Menu

    Real 3d animated cloud gallery in jQuery with following features :

    Features :

    • Real 3D.
    • Ten predefined templates.
    • Custom templates support.
    • Great for tags cloud and perfect for image gallery.
    • Works with modal window.
    • External control support.
    • Responsive.
    • Requires no knowledge to use.
    • Cross browser compatibility.
    Read More Demo

    FbAlbumPreview jQuery Plugin

    March 26, 2013 | Gallery
    FbAlbumPreview jQuery Plugin

    Today I want to share with you a jQuery plugin that I made. This jQuery plugin will enable your users to preview your web albums instantly. My inspiration here is the Facebook albums, if you have a Facebook account (I’m sure you have, haha!) and wanted to view the list of albums, you can experience this functionality:

    Read More Demo

    flickrbomb : Rapid Prototyping with jQuery Plugin

    March 25, 2013 | Gallery, Other API, Plugins
    flickrbomb : Rapid Prototyping with jQuery Plugin

    flickrBomb provides an easy way for you to fill your prototypes with relevant content, and not just those dull gray placeholder images.

    Read More Demo

    Thumbnail Grid with Expanding Preview in jQuery & CSS

    March 21, 2013 | CSS2 / CSS3.0, Gallery
    Thumbnail Grid with Expanding Preview in jQuery & CSS

    A tutorial on how to create a thumbnail grid with an expanding image preview similar to the effect seen on Google Images.If you have searched images on Google recently, you might have noticed the interesting expanding preview for a larger image when you click on a thumbnail. It’s a really nice effect and it is very practical, making a search much easier. Today we want to show you how to create a similar effect on a thumbnail grid. The idea is to open a preview when clicking on a thumbnail and to show a larger image and some other content like a title, a description and a link.

    The interesting part is to calculate the correct preview height and to scroll the page to the right position. We’ll expand the preview in a way so that we can see the respective thumbnail row and cover the rest of the remaining page. Note that we don’t use very large images for the preview in the demo so you might see a lot of empty space on large monitors.

    Read More Demo