jLayout jQuery plugin and border

[RichTWebGuy]

Does anyone have an example of using the border layout where you
specify everything in the layout call. i.e. I don't want to put class
east or west on a div, I want to specify in layout() which div is
east. I thought something like this would work

// script
$('div#wrapper2').layout
({
type: 'border',
east: $('div#content'),
west: $('div#sidebar'),
south: $('div#footer'),
hgap: 0,
vgap: 0
});

// markup
<div id="wrapper2" class="xwrapper">
<div id="sidebar" class="c">sidebar</div>
<div id="content" class="c">content</div>
<div id="footer" class="c">footer</div>
</div>

but I get JS console messages like: east[type + "Size"] is not a
function

All the examples I've seen use
<div id="wrapper1" class="border {layout: {type: 'border', hgap: 1,
vgap: 1}}">
<div id="east" class="c east">sidebar</div>
<div id="west" class="c west ">content</div>
<div id="south" class="c south">footer</div>
</div>

which works fine.

[Bram Stein]

Hi,

You can do something like this:

$('#wrapper2').layout({
type: 'border',
items: [$('#content'), $('#sidebar'), $('#footer')]
});

Those elements will still need a class of `east`, `north`, `west`,
'south` or `center'. If you want the exact behaviour you specified
you'll need to make a small change in the jLayout jQuery plugin:

Replace:
if (o.type === 'border' && typeof jLayout.border !== 'undefined')
{
$.each(['north', 'south', 'west', 'east', 'center'], function (i, name) {
if (element.children().hasClass(name)) {
o[name] = wrap(element.children('.' + name + ':first'));
}
});
element.data('jlayout', jLayout.border(o));
}

with:
if (o.type === 'border' && typeof jLayout.border !== 'undefined')
{
$.each(['north', 'south', 'west', 'east', 'center'], function (i, name) {
if (o[name]) {
o[name] = wrap[o[name]];
} else if (element.children().hasClass(name)) {
o[name] = wrap(element.children('.' + name + ':first'));
}
});
element.data('jlayout', jLayout.border(o));
}

This should use the region properties supplied in the layout call and
fall back on using class names a region is not found.

Bram

> --
> You received this message because you are subscribed to the Google Groups "jLayout" group.
> To post to this group, send email to jla...@googlegroups.com.
> To unsubscribe from this group, send email to jlayout+u...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/jlayout?hl=en.
>
>

[RichTWebGuy]

Thank you for responding, I'll try this out in the next day or two.

[RichTWebGuy]

That worked great - thanks

I made this one additional change and avoid adding markup

items: [$('#content').addClass('east'),
$('#sidebar').addClass('west'),
$('#footer').addClass('south')],