Open Source Resources for Web Application Developers

Shopify - Online Store Builder
Follow Us on Social Sites
Subscribe RSS Subscribe Newsletter Like us on Facebook Follow us on Twitter Follow us on Google+
  • Home
  • News
  • Plugins
  • Design
  • Others
  • Books
  • About
15 Jan

Create Complex Application Layout with UI.Layout

  • Framework, GPL License, MIT License
  • Leave a Comment

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

Share
Tweet
Sponsors
subscribe to our newsletter - weekly free resouces for web developers
follow us on social sites - rss, facebook, google+, Twitter
Subscribe RSS Like us on Facebook Follow us on Twitter Follow us on Google+
Related Resources
Building an Animated Cartoon Robot with jQuery

Building an Animated Cartoon Robot with jQuery

Everything You Know About CSS Is Wrong

Everything You Know About CSS Is Wrong

Automatic Image Rotator with CSS and jQuery

Automatic Image Rotator with CSS and jQuery

Create Responsive Calendar with Calendario jQuery Plugin

Create Responsive Calendar with Calendario jQuery Plugin

Micro Grid Based Wireframe PSD Template

Micro Grid Based Wireframe PSD Template

Design Your XHTML and CSS Layout with YAML Builder

Design Your XHTML and CSS Layout with YAML Builder

Comments
  • 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.

Open Source Resources for You

What we need is a list of the top quality resources, so that we can spend more time on our web development. WebAppers only picks the top quality web development resources for you.

© Copyright 2012 WebAppers | About | Archives | Privacy Policy | Advertise | Contact

Sponsors
Advertise Here
Search
By Keywords
30 Days / All Time
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • Professional Business Cards Made By Designers
  • Best Free Chrome Extensions for Web Developers
  • All of the Best Free WordPress Themes You Need
  • How to Create a Web App Admin User Interface
  • Nice List of Open Source Fish Eye Menu
  • Best Web Admin Templates
  • 25 Useful Blogs for Web Design & Development
  • Simple Javascript Progress Bar with CSS
  • 10 Useful & Quality Design Resources
  • Free Web Application Icons
  • Free Responsive HTML5 + CSS3 Site Templates
  • 35 Creative Twitter Covers for Web Designers
  • FROONT: Responsive Web Design in the Visual Way
  • Designing Experiences for Responsive Web Sites
  • jQuery Unveil: The Lightweight Version of Lazy Load
  • What are HTML5 Datalists and When to Use Them
  • Easy Responsive Tabs jQuery Plugin for Web & Mobile
  • jQuery.Swatches Turns Div into a Sweet Color Swatch
  • Pure: A Set of Small & Responsive CSS Modules
  • Create Sexy Android-like UI with Fries
Sponsors
Plugins
  • Advertisement15
  • Calendar48
  • Capture19
  • Charts55
  • Chat22
  • Demo Tour17
  • Gallery121
  • Maps30
  • Menu87
  • Polls9
  • Popup50
  • Tooltips42
  • Upload33
  • Video18
Desgin
  • Brushes11
  • Buttons27
  • Color Schemes25
  • Fonts47
  • Forms115
  • Icons110
  • Patterns24
  • PS Tutorials17
  • Stock Photos21
  • Tables25
Others
  • Announcement104
  • Best Collections6
  • Code57
  • eCommerce25
  • Framework217
  • Hosting13
  • Information245
  • Inspiration32
  • Legal Documents10
  • Reviews8
  • Security13
  • Social28
  • Sound16
  • Stats40
  • Tools302
  • Webmail14
Licesnes
  • BSD License69
  • CC License123
  • GPL License224
  • LGPL License40
  • License Free749
  • MIT License423
Sponsors
Advertise Here
Partners
MaxCDN