Flow Gallery is a
jQuery plugin based HTML5 multimedia gallery enabling you to showcase your
photos/audio/video in a modern and sleek interface. You have the option of presenting your items in in either
columns or
rows type
grid. Along with photos you can choose to display your own
self-hosted audio/video files or videos from
Youtube/Vimeo/Dailymotion. The gallery features a fully
responsive design and can fit in any screen size ranging from mobile phones to desktop browsers. The gallery is also optimized for
retina and touch screens and provides the feel of a native app.
Flow Gallery plays audio/video using
HTML5 in supported browsers and fallbacks to
Flash in older browsers. You can pass only a
mp4 file for video and
mp3 file for audio or pass all the necessary formats for the widest possible support of native HTML5 playback. Whatever you choose to do the player will work in both modern and old browsers (with suitable fallbacks where necessary).
The key features are:
Display photos, audio and video
All gallery data is passed either as JSON or as a javascript object.
Two types of display – columns or rows.
Plays audio and video natively in modern HTML5 browsers and switches over to Flash/Silverlight for older browsers.
Can embed Youtube, Vimeo and Dailymotion videos.
Supports multiple gallery albums or sets.
Items can be shown as cards or as tiles. Also albums can be shown with stacked effect or as tiles.
Items can have titles and/or descriptions with various options of showing them based on item display style.
There are numerous options of animating item/album entrances, titles, descriptions and the lightbox.
Filter items by file type or custom categories.
Sort items by title, type or custom sort parameters, both numeric and alphabetic and in either ascending or descending order.
Show/hide the various menu bar components, fix the menu bar on page scroll, or even hide it completely.
True HTML5 Fullscreen option in supported browsers.
Deep-linking feature which provides links to individual items, with album support, allowing you to bookmark/share them.
Load items in chunks which can either be loaded manually or automatically as the page is scrolled.
Allow sharing of items to popular social media sites from within the gallery.
Option to build your gallery by scanning a folder of photos, with support for albums.
Display your photos’ EXIF data as item descriptions.
Enable caching of data to have faster loading. Useful for Youtube/Vimeo/Dailymotion, folder scanning, EXIF extraction.
The gallery items can also act as links to external pages.
Several useful developer friendly API functions and events have been provided.
The gallery has a fully responsive design and has been optimized for viewing in mobile, retina and touch screens.
Configurable options are:
Choose between two grid types – columns or rows.
For rows type grid you can set the minimum item width and also choose to always justify the last row, so that it occupies the full width.
For columns type grid you have the option of setting the number of columns for various screen sizes or just use the same number of columns for all screen sizes.
You can set the horizontal and vertical gutters or space between items.
Option to shuffle or randomly order the items every time the page loads.
You can choose between ten available entrance animations of album thumbnails, which can be either sequential or simultaneous.
Choose between two styles for album thumbnails – stacked or tiled.
Choose from four available transitions from the albums page to the items page.
You can choose between ten available entrance animations of gallery items, which can be either sequential or simultaneous.
Choose between two styles for gallery items – card or tile.
For card style of items you can set the maximum height for the caption area, choose to always show the caption area below the item thumbnail, and if the previous option is enabled, choose to show the item description in the caption area on page load.
Option to always to show the item title over the thumbnail.
If the thumbnail title is hidden on page loaded then choose between two animations for the showing the title.
If the caption area is hidden on page load then choose from nine available animations for showing the caption, along with the option to set the animation speed.
If your gallery items consist of Youtube/Vimeo/Dailymotion videos then you can choose to get the thumbnails from them.
You can make the gallery items/thumbnails act as links to external pages with the option opening those links in new windows/tabs.
Option to load gallery items in chunks instead of all at once on page load.
Option to load item chunks either manually by clicking a “load more” button or to load chunks automatically as the page is scrolled.
Option to set the size of each chunks, and also an additional option of setting the initial chunk size that will be loaded when the gallery gets shown in the page.
You can choose to enable deep linking which will create unique url’s for the gallery items when they are shown in the lightbox. These links can be bookmarked and will also affect the browser history. Deep linking of items within albums is also supported.
Option to enable social sharing of items. You can choose to enable sharing to any combination of the following social media sites – Facebook, Twitter, Google+ and Pinterest.
You can choose to show the file or media type icons on the gallery items.
Option to show the gallery menu bar.
Option to show the filter dropdown in the gallery menu bar.
You can also choose to show file type (photo, audio, video) filter buttons.
If your items belong to custom categories (provided in the gallery config data) then you can choose to show any or all of the custom category filter buttons.
Option to show the sort dropdown in the gallery menu bar.
You can show buttons to sort items based on title, category or any custom sorting parameter.
Option to show the keyword search filter, and also choose to search from either titles or categories.
Option to set the animation speed when filtering or sorting items.
Option show the fullscreen button in the menu bar. The gallery uses the HTML5 Fullscreen API, so the button will only show up in supported browsers.
Option to fix the gallery menu bar at the top of the page when the page is scrolled, along with the option to provide a vertical offset for placing the menu bar.
Choose to autoplay audio/video files, including Youtube/Vimeo/Dailymotion videos, when they are are shown in the lightbox. Autoplay will not work in mobiles because it is disabled by mobile device manufacturers.
Choose between seven animations for showing items in the lightbox.
Option to scan photos for their EXIF data and show it as descriptions in the caption area.
Option to build a gallery by scanning a folder of photos, with support for albums.
Option to provide gallery data either as json, which will be pulled from a url you provide, or as a javascript object.
Option to cache the gallery config data, for a specified time interval.
Special Notes
Autoplay option will not work in mobile devices. This is disabled by device manufactures.
Player volume setting will not show up or work in Android devices. You have to control the volume through the device’s own volume buttons.
Also some of the modern HTML5 features such as Fullscreen will only work in modern browsers.
The gallery script has been tested and is fully compatible with jQuery 1.9+. and also jquery 2.0+.
If you have any query regarding any feature of the gallery before purchasing then please post your query in the comments section and I will get back to you as soon as possible.
Updated on 22 March, 2015 – version 1.2
Added a new API event that fires when the plugin loads the contents of an album
Made some minor tweaks to the plugin’s js and css files.
Updated on 16 March, 2015 – version 1.1
Gallery items/thumbnails can now act as links to external pages with the option of opening those links in new windows/tabs.
Updated on 13 March, 2015 – version 1.0.1
Fixed some minor bugs.
More Items by CosmoCoder
