/ best free open source web resources /


Create Complex Application Layout with UI.Layout

Posted · Category: Framework, GPL License, MIT License

UI.Layout was inspired by the extJS border-layout, and recreates that functionality as a jQuery plug-in. The UI.Layout plug-in can create any UI look you want – from simple headers or sidebars, to a complex application with toolbars, menus, help-panels, status bars, sub-forms, etc.

UI.Layout creates a ‘page-layout’ that has auto-sizing ‘center pane’ surrounded by up to four collapsible and resizable ‘border panes’ (north, south, east & west). It can also create multiple headers & footers inside each pane.

For more complex layouts, you can nest layouts within layouts. Or use an iframe as a pane to create a ‘sub-form’ that can have its own layout. The possibilities are unlimited – from simple fixed headers or sidebars to rich applications. Layouts are created from existing elements (divs, iframes, etc), so UI.Layout will degrade gracefully.

Combined it with other jQuery UI widgets to create a sophisticated application. There are no limitations or issues – this widget is ready for production use. You can checkout Demos page for a list of all demos and samples.

jQuery UI Layout

Requirements: jQuery Framework
Demo: http://layout.jquery-dev.net/
License: GPL, MIT License

  • Pingback: Create Complex Application Layout with UI.Layout | Web Resources | WebAppers - Illuminations

  • http://iconwebdesigns.net Dean

    This is amazing!

    I can’t wait to use it on something….anything!

  • http://irongaze.com Rob Morris

    This looks pretty exciting. I moved off of ExtJS when they made it clear they didn’t want or particularly like open-source licensing, and one of the main things I’ve missed in moving to jQuery has been Ext’s powerful layout system. I’ll be playing with this one tonight to see if it lives up to the pitch, but I’m very pleased that someone is taking a shot at this type of functionality for jQuery.

  • Pingback: UI.Layout: plugin de jQuery para crear layouts | Mantis Technology Solutions Blog

  • http://www.merlinvicki.in merlinvicki

    amazing. thanks for posting.

  • http://www.artynest.com vinayak

    cool good stuff for designers

  • Dharmendra kumar

    can I use fluidtextresizer.js and ui.layout jqery in same interface.

Supported By


Web Browsers Icon Set
Food Icon Set
Flat Icon Set

Flat Icon Set

100 icons