YUI recommends YUI3.

YUI 2 has been deprecated since 2011. This site acts as an archive for files and documentation.

This documentation is no longer maintained.

YUI Library Examples: Layout Manager: Nesting a layout

Layout Manager: Nesting a layout

This example shows how to nest a Layout inside another layout.

Set up the Layout Manager for a full page layout

First we will make a full page layout by omitting the first parameter to the Layout Manager's constructor.

Setting up the first Layout's Units

For this example we will create all 5 units in the full page layout.

Setting up the second layout

Now that we have the first layout rendered and working, we will go back and listen for the render event on the first layout to create the second one.

Inside the render event, we will call the getUnitByPosition('center') on the first layout to get the center unit. Then we will call its method .get('wrap'); to get us the root element of that unit.

Now that we have it, we will use it as the root element of the second layout and set it up as an element based layout.

Note: that we are passing the parent config option. This config option will bind the 2 layouts together so that a resize on one will fire a resize on the other.

Full Example Source

Copyright © 2013 Yahoo! Inc. All rights reserved.

Privacy Policy - Copyright Policy - Job Openings