Best jQuery Grid Plugins & Tutorials with Demo

    CodingJack’s jQuery 3D Carousel

    November 11, 2012 | Carousel, CSS2 / CSS3.0, HTML5, Premium, Responsive
    CodingJack's jQuery 3D Carousel

    CodingJack’s 3D Carousel is a Real 3D using CSS3 3D Transforms carousel plugin with jQuery,Html5 & Css3

    The carousel is supported on iOS and Android and includes touch swipe functionality. It looks great on a tablet and will even work on a smartphone. But because the carousel can appear small on smaller screens, I’ve included two special options for smartphones:

    • Option to display a thumbnail grid instead (the “fallback” presentation)
    • Option to transform the grid fallback into a responsive layout. View either preview from your phone for an example.
    Read More Demo

    Griddy : Simple Grid Overlay Plugin for jQuery

    November 10, 2012 | Layout, Plugins
    Griddy : Simple Grid Overlay Plugin for jQuery

    Griddy is a small JQuery plugin thats creates a simple, customizable grid overlay on top of any element. It can also calculate row heights and column widths automatically based on the number of rows/columns and gutter space.

    Read More Demo

    Gamma Gallery: A jQuery Responsive Image Gallery Experiment

    November 9, 2012 | Gallery, HTML5, Popup Window, Premium, Responsive
    Gamma Gallery: A jQuery Responsive Image Gallery Experiment

    Gamma Gallery is an experimental responsive image gallery that attempts to provide an adjustable responsive images approach taking its grid layout and the full slideshow view into account.Gamma Gallery uses David David DeSandro’s Masonry in a fluid mode where column numbers are defined depending on the grid container sizes.

    Read More Demo

    Grid-A-Licious : A jQuery Responsive Grid Layout

    November 3, 2012 | Layout, Plugins, Responsive
    Grid-A-Licious : A jQuery Responsive Grid Layout

    I created a jQuery plugin. I named it Grid-A-Licious and described it as, “Divs are placed in chronological order with a special grid” because I had no clue how to explain it better.Today this floating grid layout effect is heavily used around the net and there are tons of different variations of the script to download and use. Some more popular than the other, but all does a better job than Grid-A-Licious.

    Read More Demo

    xSquare : Responsive Image Slider in html5/jquery

    October 15, 2012 | CSS2 / CSS3.0, HTML5, Plugins, Premium, Responsive, Slider
    xSquare : Responsive Image Slider in html5/jquery

    xSquare is a responsive jQuery image slider. It has a layout that consists of grids making it useful for variety of web page positions. Though the main purpose of the image slider is within a banner position it can easily be implemented as an image gallery or something similar because it is compatible with lightbox, prettyPhoto etc. The loading of images is done via smart lazyLoad with an implemented loader. Effective sliding transitions make the slider have a more dynamic look. The xSquare responsive image slider gives you the option to place up to 7 images in one slide or to place one effectively sliced photo.

    Read More Demo

    Flex : A fluid asymmetrical jQuery Animated Grid plugin

    October 10, 2012 | Animation, Layout, Plugins
    Flex : A fluid asymmetrical jQuery Animated Grid plugin

    A fluid asymmetrical animated grid plugin for jQuery.Flex is an idea inspired by the old flash homepage on Adidas.com. Searching google for anything that resembled that effect, lead me to a few plugins that were similar, but not the same. Saw one person say it was “quite impossible”, thought it would be a fun challenge.

    Read More Demo

    Shuffling Tiles jQuery Plugin

    October 6, 2012 | Gallery, Plugins, Premium
    Shuffling Tiles jQuery Plugin

    Inspired by the step by step movements of the shuffle dance and the new Metro UI look, Shuffling Tiles combines elements from both and then some, producing a versatile, animated and compact webpage widget. Use it when you have lot’s of information that you want to fit in a small area, and you want to present it in a lively, original and interactive way.

    The plugin features lots of customization options, including setting:

    • different animation speeds and types
    • tiles dimensions for width, height and padding
    • the grid layout, with a choice of upto 4 different styles, and whether the layout is fixed or responsive
    • the number of tiles, anything between 1 and 6
    Read More Demo

    jquery.vgrid : jQuery plugin variable grid layout

    September 22, 2012 | Layout, Plugins
    jquery.vgrid : jQuery plugin variable grid layout

    I tried to introduce a variable grid layout using jquery.vgrid.js powered by jQuery.The simplest type from a sample of seven ul marked up with ” Variable grid layout. “I tried to arrange a thumbnail of the theme in the following pages.

    Read More Demo

    Clip Gallery : jQuery Clip Animation Photo Gallery

    September 15, 2012 | Animation, Gallery, Image Effects
    Clip Gallery : jQuery Clip Animation Photo Gallery

    ClipGallery is a new way to show your pics. In combination with jQuery and the ClipFX plugin, it puts your photos in a grid and as the mouse moves over the “thumbs” they expand at full size.

    Read More Demo

    MelonHTML5 : 3D Cube Gallery in Html5, jQuery & CSS3

    September 14, 2012 | Animation, CSS2 / CSS3.0, Gallery, HTML5, Plugins, Popup Window, Premium
    MelonHTML5 : 3D Cube Gallery in Html5, jQuery & CSS3

    This is a flexible and easy to integrate Photo Gallery written in HTML5 , CSS3 and jQuery.

    Features:

    • 3D Cube Animation (Chrome, Safari, Firefox, IE10 )
    • Automatic thumbnail generation
    • Unique animated thumbnail preview
    • Grid or Custom Layout
    • Lightbox
      • Navigation
      • Keyboard Control
      • 3 Animations
      • Slideshow
    Read More Demo