$("#ID").splitter({ type: "v", minA: 100, initA: 150, maxA: 300, accessKey: "|" })

NAME

JQuery::Splitter - Split into panes

VERSION

Version 1.00

SYNOPSIS

JQuery::Splitter is used to split an area into two panes. This can be extended to three or more by nesting

    use JQuery;
    use JQuery::Splitter ;
    my $splitter1 = JQuery::Splitter->new(id => 'MySplitter', 
					  addToJQuery => $jquery,
					  browserFill => 1,
					  type => 'v',
					  HTML1 => $leftHTML, HTML2 => $rightHTML) ;

DESCRIPTION

This module is a bit more complicated than others, since CSS needs to be set to get good results. For complete information see http://methvin.com/jquery/splitter/

    my $mainPanelCSS = new JQuery::CSS(hash => {'#MySplitter' => {'min-width' => '500px', 'min-height' => '300px', border => '4px solid #669'}}) ; 
    my $panel1CSS = new JQuery::CSS(hash => { '#LeftPanel' => {background => 'blue', padding => '8px'}}) ; 
    my $panel2CSS = new JQuery::CSS(hash => { '#RightPanel' => {background => 'yellow', padding => '4px'}}) ; 
    my $splitter1 = JQuery::Splitter->new(id => 'MySplitter', 
					  addToJQuery => $jquery,
					  browserFill => 1,
					  type => 'v', accessKey => "I",  panel1 => 'LeftPanel', panel2 => 'RightPanel',
					  mainPanelCSS => $mainPanelCSS,
					  panel1CSS => $panel1CSS,
					  panel2CSS => $panel2CSS,
					  panel1Params => {minA => 100, initA => 100, maxA => 1000},
                                          splitBackGround => 'pink',
                                          splitActive => 'red',
                                          splitHeight => '6px',
                                          splitRepeat => 1,
					  HTML1 => $leftHTML, HTML2 => $rightHTML) ;

Have a look at the splitter examples.

addToJQuery

Add the item to JQuery

browserFill

Set this to 1 if you want the panel to fill the whole page

type

Set to h for horizontal split and v for vertical split

accessKey

Allows user access to a splitter bar through the keyboard

panel1

Give an id to the left/top panel

panel2

Give an id to the right/bottom panel

mainPanelCSS

Define CSS for the main panel

panel1CSS

Define CSS for the left/top panel

panel2CSS

Define CSS for the right/bottom panel

panel1Params
minA

Minimum size for the panel

initA

Initial size for the panel

maxA

Maximum size for the panel

panel2Params
minB

Minimum size for the panel

initB

Initial size for the panel

maxB

Maximum size for the panel

splitBackGround

Define the colour for the background of the splitter bar

splitActive

Define the colour for the splitter bar when it is active

splitHeight

Define the size of the splitter bar

HTML1

Set the HTML for the top/left panel

HTML2

Set the HTML for the bottom/right panel

internalPanel

If panels are put one inside another, the internal panels must have this flag set. The splitter bars take all their definitions from the outermost panel. That is, they cannot be changed.

FUNCTIONS

HTML

Get the HTML for the object

new

Instantiate the object

setHTML1

Set HTML1 for the object

setHTML2

Set HTML2 for the object

AUTHOR

Peter Gordon, <peter at pg-consultants.com>

BUGS

Please report any bugs or feature requests to bug-jquery-taconite at rt.cpan.org, or through the web interface at http://rt.cpan.org/NoAuth/ReportBug.html?Queue=JQuery. I will be notified, and then you'll automatically be notified of progress on your bug as I make changes.

SUPPORT

You can find documentation for this module with the perldoc command.

perldoc JQuery

You can also look for information at:

ACKNOWLEDGEMENTS

COPYRIGHT & LICENSE

Copyright 2007 Peter Gordon, all rights reserved.

This program is free software; you can redistribute it and/or modify it under the same terms as Perl itself.