Best jQuery Layout Plugins & Tutorials with Demo

ungrid : Simplest Responsive CSS Grid

ungrid : Simplest Responsive CSS Grid

ungrid is a tiny, responsive, table-based CSS grid system. The entire ungrid.css file is 97 bytes minified.

jLayout : JavaScript Layout Algorithms

jLayout : JavaScript Layout Algorithms

he jLayout JavaScript library provides layout algorithms for laying out components. A component is an abstraction; it can be implemented in many ways, for example as items in a HTML5 Canvas drawing or as HTML elements. The jLayout library allows you to focus on drawing the individual components instead of on how to arrange them on your screen.

jQuery Gridmanager : Building Rows and Grids

jQuery Gridmanager : Building Rows and Grids

jQuery GridManager is a way of building rows and grids with built in editable regions.Requires jQuery, jQueryUI, Bootstrap 3.x, & optional TinyMCE or CKEditor.

BrickWork : jQuery Plugin to Create Dynamic layouts

BrickWork : jQuery Plugin to Create Dynamic layouts

BrickWork is a reponsive jQuery plugin to create Dynamic layouts. The main goal is to create the best and most customizable dynamic layouts plugins.

jsPanel : jQuery plugin to Generate Floating Panels

jsPanel : jQuery plugin to Generate Floating Panels

A jQuery Plugin to generate configurable floating panels for use in a backend solution and other web applications.

jBlocks : jQuery layouts Library for Responsive Design way

jBlocks : jQuery layouts Library for Responsive Design way

jBlocks is a javascript library that can be used as a jQuery plugin and/or a framework taking care of the layout in a HTML5 application. It allows designing applications that will run on desktops as well as on mobile devices without having to worry much about the details of screen resolution, pixel density and so on.

jBlocks arranges rectangular blocks into a viewport according to a set of loose preferences given by the developer. The library tries to minimize the spare areas without content in real time. This means the application may add, remove or modify blocks geometry and jBlocks will recalculate and adjust the layout accordingly.

Features:

  • works on desktops and mobiles
  • comes with a large of predefined block widget classes
  • widget classes can easily be extended
  • support either vertical or horizontal scrolling

Galereya : Easily customizable jQuery gallery with a masonry layout

Galereya : Easily customizable jQuery gallery with a masonry layout

Responsive, easily customizable jquery gallery with a masonry layout. Almost all animation and effects are based on CSS features.Works on Chrome, Safari, Firefox, Opera(turned off some CSS animations), IE7+(Graceful degradation), Android browser, Chrome mobile, Firefox mobile, Safari on iOS and etc. Galereya effects and browser compatibility depends on your custom CSS styles a lot!

Blueprint Split Layout with CSS3 & JavaScript

Blueprint Split Layout with CSS3 & JavaScript

This Blueprint is a layout with two sides, sometimes seen in portfolio websites of couples and partners. The idea is to show an initial two-sided view and when clicking on a side, the whole page transitions into the respective direction. The individual page of the selected person is shown.

The Blueprint comes with some example media queries and a second demo where the disappearing side scales down. It will work in modern browsers (from IE9 on).

freewall : jQuery plugin for Creating dynamic Grid layout

freewall : jQuery plugin for Creating dynamic Grid layout

Freewall is a responsive and cross-browser jQuery plugin for creating dynamic grid layouts for desktop, mobile and tablet. Freewall is all-in-one solution help you to create many types of grid layout (flexible layout, grid layout, images layout, pinterest-like layout, etc) with nice CSS3 animation effects and call back events..

Waterfall : jQuery Pinterest-like layout Plugin

Waterfall : jQuery Pinterest-like layout Plugin

Waterfall layout. Lightweight version of fluid columns masonry layout of isotope.Pinterest-like layout with fluid width of columns. Fast, tiny, reliable and free alternative to isotope masonry column shift layout.