webgui/www/extras/yui-ext/docs/YAHOO.ext.SplitBar.html
JT Smith 4f68a0933c added YUI and YUI-ext
fixed the resizable text area with IE problem
fixed the ad space with IE problem
merged the 7.2.0 and 7.1.4 change logs
2006-11-07 23:15:57 +00:00

725 lines
19 KiB
HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN""http://www.w3.org/TR/REC-html40/loose.dtd">
<!--NewPage-->
<HTML>
<HEAD>
<TITLE>
YAHOO.ext.SplitBar
</TITLE>
<LINK REL ="stylesheet" TYPE="text/css" HREF="stylesheet.css" TITLE="Style">
</HEAD>
<SCRIPT>
function asd()
{
parent.document.title="YAHOO.ext.SplitBar";
}
</SCRIPT>
<BODY BGCOLOR="white" onload="asd();" style="margin:15px;">
<!-- ======== START OF CLASS DATA ======== -->
<H2>Class YAHOO.ext.SplitBar</H2>
<PRE>Object
|
+--<b>YAHOO.ext.SplitBar</b>
</PRE>
<HR>
<DL>
<!-- Class definition -->
<DT>class
<B>YAHOO.ext.SplitBar</B>
</DL>
<P>
<BR/>Creates draggable splitter bar functionality from two elements.
<br><br>
Usage:
<pre><code>
var split = new YAHOO.ext.SplitBar('elementToDrag', 'elementToSize',
YAHOO.ext.SplitBar.HORIZONTAL, YAHOO.ext.SplitBar.LEFT);
split.setAdapter(new YAHOO.ext.SplitBar.AbsoluteLayoutAdapter("container"));
split.minSize = 100;
split.maxSize = 600;
split.animate = true;
split.onMoved.subscribe(splitterMoved);
</code></pre>
<BR/><I>Defined in <a href='overview-summary-SplitBar.js.html'>SplitBar.js</a></I><BR/><BR/><B>Requires:</B><UL>- <a href="YAHOO.ext.Element.html#">YAHOO.ext.Element</a><BR/>- YAHOO.util.Dom<BR/>- YAHOO.util.Event<BR/>- <a href="YAHOO.util.CustomEvent.html#">YAHOO.util.CustomEvent</a><BR/>- YAHOO.util.DDProxy<BR/>- YAHOO.util.Anim (optional) to support animation<BR/>- YAHOO.util.Easing (optional) to support animation</UL>
</P>
<HR>
<!-- ======== NESTED CLASS SUMMARY ======== -->
<A NAME="inner_classes"><!-- --></A>
<TABLE BORDER="1" CELLPADDING="3" CELLSPACING="0" WIDTH="100%">
<TR BGCOLOR="#CCCCFF" CLASS="TableHeadingColor">
<TD COLSPAN="2" class="title-cell">Nested Class Summary</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%"><FONT SIZE="-1">
<CODE>&lt;static&nbsp;class&gt;</CODE></FONT></TD>
<TD><CODE><B><A HREF="YAHOO.ext.SplitBar.BasicLayoutAdapter.html">YAHOO.ext.SplitBar.BasicLayoutAdapter</A></B></CODE></TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%"><FONT SIZE="-1">
<CODE>&lt;static&nbsp;class&gt;</CODE></FONT></TD>
<TD><CODE><B><A HREF="YAHOO.ext.SplitBar.AbsoluteLayoutAdapter.html">YAHOO.ext.SplitBar.AbsoluteLayoutAdapter</A></B></CODE></TD>
</TR>
</TABLE>
&nbsp;
<!-- ======== END NESTED CLASS SUMMARY ======== -->
<!-- =========== FIELD SUMMARY =========== -->
<A NAME="field_summary"><!-- --></A>
<TABLE BORDER="1" CELLPADDING="3" CELLSPACING="0" WIDTH="100%">
<TR BGCOLOR="#CCCCFF" CLASS="TableHeadingColor">
<TD COLSPAN="2" class="title-cell">Field Summary</TD></TR>
<!-- This is one instance field summary -->
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%"><FONT SIZE="-1">
<CODE>&nbsp;Boolean</CODE></FONT></TD>
<TD><CODE><B><A HREF="#animate">animate</A></B></CODE>
<BR>
&nbsp;&nbsp;Whether to animate the transition to the new size</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%"><FONT SIZE="-1">
<CODE>&nbsp;Number</CODE></FONT></TD>
<TD><CODE><B><A HREF="#maxSize">maxSize</A></B></CODE>
<BR>
&nbsp;&nbsp;The maximum size of the resizing element.</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%"><FONT SIZE="-1">
<CODE>&nbsp;Number</CODE></FONT></TD>
<TD><CODE><B><A HREF="#minSize">minSize</A></B></CODE>
<BR>
&nbsp;&nbsp;The minimum size of the resizing element.</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%"><FONT SIZE="-1">
<CODE>&nbsp;CustomEvent</CODE></FONT></TD>
<TD><CODE><B><A HREF="#onMoved">onMoved</A></B></CODE>
<BR>
&nbsp;&nbsp;Fires when the SplitBar is moved.</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%"><FONT SIZE="-1">
<CODE>&nbsp;Boolean</CODE></FONT></TD>
<TD><CODE><B><A HREF="#useShim">useShim</A></B></CODE>
<BR>
&nbsp;&nbsp;Whether to create a transparent shim that overlays the page when dragging, enables dragging across iframes.</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%"><FONT SIZE="-1">
<CODE>&lt;static&gt; &nbsp;Number</CODE></FONT></TD>
<TD><CODE><B><A HREF="#!s!BOTTOM">BOTTOM</A></B></CODE>
<BR>
&nbsp;&nbsp;Placement constant - The resizing element is positioned under splitter element</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%"><FONT SIZE="-1">
<CODE>&lt;static&gt; &nbsp;Number</CODE></FONT></TD>
<TD><CODE><B><A HREF="#!s!HORIZONTAL">HORIZONTAL</A></B></CODE>
<BR>
&nbsp;&nbsp;Orientation constant - Create a horizontal SplitBar</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%"><FONT SIZE="-1">
<CODE>&lt;static&gt; &nbsp;Number</CODE></FONT></TD>
<TD><CODE><B><A HREF="#!s!LEFT">LEFT</A></B></CODE>
<BR>
&nbsp;&nbsp;Placement constant - The resizing element is to the left of the splitter element</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%"><FONT SIZE="-1">
<CODE>&lt;static&gt; &nbsp;Number</CODE></FONT></TD>
<TD><CODE><B><A HREF="#!s!RIGHT">RIGHT</A></B></CODE>
<BR>
&nbsp;&nbsp;Placement constant - The resizing element is to the right of the splitter element</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%"><FONT SIZE="-1">
<CODE>&lt;static&gt; &nbsp;Number</CODE></FONT></TD>
<TD><CODE><B><A HREF="#!s!TOP">TOP</A></B></CODE>
<BR>
&nbsp;&nbsp;Placement constant - The resizing element is positioned above the splitter element</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%"><FONT SIZE="-1">
<CODE>&lt;static&gt; &nbsp;Number</CODE></FONT></TD>
<TD><CODE><B><A HREF="#!s!VERTICAL">VERTICAL</A></B></CODE>
<BR>
&nbsp;&nbsp;Orientation constant - Create a vertical SplitBar</TD>
</TR>
</TABLE>
&nbsp;
<!-- =========== END FIELD SUMMARY =========== -->
<!-- ======== CONSTRUCTOR SUMMARY ======== -->
<A NAME="constructor_summary"><!-- --></A>
<TABLE BORDER="1" CELLPADDING="3" CELLSPACING="0" WIDTH="100%">
<TR BGCOLOR="#CCCCFF" CLASS="TableHeadingColor">
<TD COLSPAN="2" class="title-cell">
Constructor Summary
</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD>
<CODE>
<B>
<A HREF="YAHOO.ext.SplitBar.html#YAHOO.ext.SplitBar()">YAHOO.ext.SplitBar</A>
</B>
(&lt;String/HTMLElement/Element&gt; dragElement, &lt;String/HTMLElement/Element&gt; resizingElement, &lt;Number&gt; orientation, &lt;Number&gt; placement)
</CODE>
<BR>
&nbsp;&nbsp;
</TD>
</TR>
</TABLE>
<!-- ======== END CONSTRUCTOR SUMMARY ======== -->
&nbsp;
<!-- ========== METHOD SUMMARY =========== -->
<A NAME="method_summary"><!-- --></A>
<TABLE BORDER="1" CELLPADDING="3" CELLSPACING="0" WIDTH="100%">
<TR BGCOLOR="#CCCCFF" CLASS="TableHeadingColor">
<TD COLSPAN="2" class="title-cell">
<span style="float:left">Method Summary</span>
<span style="float:right;font-weight:normal;font-size:8pt;">
<i>* Parameter types in italic indicate optional parameters</i>
</span>
</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%">
<FONT SIZE="-1">
<CODE>&nbsp;Object</CODE>
</FONT>
</TD>
<TD>
<CODE>
<B>
<A HREF="#getAdapter">getAdapter</A></B>()
</CODE>
<BR>
&nbsp;&nbsp;
Get the adapter this SplitBar uses
</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%">
<FONT SIZE="-1">
<CODE>&nbsp;Number</CODE>
</FONT>
</TD>
<TD>
<CODE>
<B>
<A HREF="#getMaximumSize">getMaximumSize</A></B>()
</CODE>
<BR>
&nbsp;&nbsp;
Gets the maximum size for the resizing element
</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%">
<FONT SIZE="-1">
<CODE>&nbsp;Number</CODE>
</FONT>
</TD>
<TD>
<CODE>
<B>
<A HREF="#getMinimumSize">getMinimumSize</A></B>()
</CODE>
<BR>
&nbsp;&nbsp;
Gets the minimum size for the resizing element
</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%">
<FONT SIZE="-1">
<CODE>&nbsp;void</CODE>
</FONT>
</TD>
<TD>
<CODE>
<B>
<A HREF="#setAdapter">setAdapter</A></B>(&lt;Object&gt; adapter)
</CODE>
<BR>
&nbsp;&nbsp;
Set the adapter this SplitBar uses
</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%">
<FONT SIZE="-1">
<CODE>&nbsp;void</CODE>
</FONT>
</TD>
<TD>
<CODE>
<B>
<A HREF="#setCurrentSize">setCurrentSize</A></B>(&lt;Number&gt; size)
</CODE>
<BR>
&nbsp;&nbsp;
Sets the initialize size for the resizing element
</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%">
<FONT SIZE="-1">
<CODE>&nbsp;void</CODE>
</FONT>
</TD>
<TD>
<CODE>
<B>
<A HREF="#setMaximumSize">setMaximumSize</A></B>(&lt;Number&gt; maxSize)
</CODE>
<BR>
&nbsp;&nbsp;
Sets the maximum size for the resizing element
</TD>
</TR>
<TR BGCOLOR="white" CLASS="TableRowColor">
<TD ALIGN="right" VALIGN="top" WIDTH="1%">
<FONT SIZE="-1">
<CODE>&nbsp;void</CODE>
</FONT>
</TD>
<TD>
<CODE>
<B>
<A HREF="#setMinimumSize">setMinimumSize</A></B>(&lt;Number&gt; minSize)
</CODE>
<BR>
&nbsp;&nbsp;
Sets the minimum size for the resizing element
</TD>
</TR>
</TABLE>
<P>
<!-- ========== END METHOD SUMMARY =========== -->
<!-- ============ FIELD DETAIL START =========== -->
<A NAME="field_detail"><!-- --></A>
<TABLE BORDER="1" CELLPADDING="3" CELLSPACING="0" WIDTH="100%">
<TR BGCOLOR="#CCCCFF" CLASS="TableHeadingColor">
<TD COLSPAN="1" class="title-cell">Field Detail</TD>
</TR>
</TABLE>
<A NAME="animate"><!-- --></A>
<H3>animate</H3>
<PRE>Boolean&nbsp;<B>animate</B></PRE>
<UL>
Whether to animate the transition to the new size
</UL>
<HR>
<A NAME="maxSize"><!-- --></A>
<H3>maxSize</H3>
<PRE>Number&nbsp;<B>maxSize</B></PRE>
<UL>
The maximum size of the resizing element. (Defaults to 2000)
</UL>
<HR>
<A NAME="minSize"><!-- --></A>
<H3>minSize</H3>
<PRE>Number&nbsp;<B>minSize</B></PRE>
<UL>
The minimum size of the resizing element. (Defaults to 0)
</UL>
<HR>
<A NAME="onMoved"><!-- --></A>
<H3>onMoved</H3>
<PRE>CustomEvent&nbsp;<B>onMoved</B></PRE>
<UL>
Fires when the SplitBar is moved. Uses fireDirect with signature: (this, newSize)
</UL>
<HR>
<A NAME="useShim"><!-- --></A>
<H3>useShim</H3>
<PRE>Boolean&nbsp;<B>useShim</B></PRE>
<UL>
Whether to create a transparent shim that overlays the page when dragging, enables dragging across iframes.
</UL>
<HR>
<A NAME="!s!BOTTOM"><!-- --></A>
<H3>BOTTOM</H3>
<PRE>&lt;static&gt;&nbsp;Number&nbsp;<B>BOTTOM</B></PRE>
<UL>
Placement constant - The resizing element is positioned under splitter element
</UL>
<HR>
<A NAME="!s!HORIZONTAL"><!-- --></A>
<H3>HORIZONTAL</H3>
<PRE>&lt;static&gt;&nbsp;Number&nbsp;<B>HORIZONTAL</B></PRE>
<UL>
Orientation constant - Create a horizontal SplitBar
</UL>
<HR>
<A NAME="!s!LEFT"><!-- --></A>
<H3>LEFT</H3>
<PRE>&lt;static&gt;&nbsp;Number&nbsp;<B>LEFT</B></PRE>
<UL>
Placement constant - The resizing element is to the left of the splitter element
</UL>
<HR>
<A NAME="!s!RIGHT"><!-- --></A>
<H3>RIGHT</H3>
<PRE>&lt;static&gt;&nbsp;Number&nbsp;<B>RIGHT</B></PRE>
<UL>
Placement constant - The resizing element is to the right of the splitter element
</UL>
<HR>
<A NAME="!s!TOP"><!-- --></A>
<H3>TOP</H3>
<PRE>&lt;static&gt;&nbsp;Number&nbsp;<B>TOP</B></PRE>
<UL>
Placement constant - The resizing element is positioned above the splitter element
</UL>
<HR>
<A NAME="!s!VERTICAL"><!-- --></A>
<H3>VERTICAL</H3>
<PRE>&lt;static&gt;&nbsp;Number&nbsp;<B>VERTICAL</B></PRE>
<UL>
Orientation constant - Create a vertical SplitBar
</UL>
<HR>
<!-- ============ FIELD DETAIL END =========== -->
<!-- ========= CONSTRUCTOR DETAIL START ======== -->
<A NAME="constructor_detail"><!-- --></A>
<TABLE BORDER="1" CELLPADDING="3" CELLSPACING="0" WIDTH="100%">
<TR BGCOLOR="#CCCCFF" CLASS="TableHeadingColor">
<TD COLSPAN="1" class="title-cell">
Constructor Detail
</TD>
</TR>
</TABLE>
<A NAME="YAHOO.ext.SplitBar()"><!-- --></A><H3>
YAHOO.ext.SplitBar</H3>
<PRE><B>YAHOO.ext.SplitBar</B>(&lt;String/HTMLElement/Element&gt; dragElement, &lt;String/HTMLElement/Element&gt; resizingElement, &lt;Number&gt; orientation, &lt;Number&gt; placement)</PRE>
<UL>
<B>Parameters:</B>
<UL><CODE>dragElement</CODE> - The element to be dragged and act as the SplitBar.
</UL>
<UL><CODE>resizingElement</CODE> - The element to be resized based on where the SplitBar element is dragged
</UL>
<UL><CODE>orientation</CODE> - (optional) Either YAHOO.ext.SplitBar.HORIZONTAL or YAHOO.ext.SplitBar.VERTICAL. (Defaults to HORIZONTAL)
</UL>
<UL><CODE>placement</CODE> - (optional) Either YAHOO.ext.SplitBar.LEFT or YAHOO.ext.SplitBar.RIGHT for horizontal or YAHOO.ext.SplitBar.TOP or YAHOO.ext.SplitBar.BOTTOM for vertical. (By default, this is determined automatically by the intial position position of the SplitBar).
</UL>
</UL>
<!-- Constructor return value(s) -->
<!-- End constructor return value(s) -->
<!-- ADDITIONAL ATTRIBUTES -->
<UL>
<B>Requires:</B><UL>- <a href="YAHOO.ext.Element.html#">YAHOO.ext.Element</a><BR/>- YAHOO.util.Dom<BR/>- YAHOO.util.Event<BR/>- <a href="YAHOO.util.CustomEvent.html#">YAHOO.util.CustomEvent</a><BR/>- YAHOO.util.DDProxy<BR/>- YAHOO.util.Anim (optional) to support animation<BR/>- YAHOO.util.Easing (optional) to support animation</UL>
</UL>
<HR/>
<!-- END ADDITIONAL ATTRIBUTES -->
<!-- ========= CONSTRUCTOR DETAIL END ======== -->
<!-- ============ METHOD DETAIL START ========== -->
<A NAME="method_detail"><!-- --></A>
<TABLE BORDER="1" CELLPADDING="3" CELLSPACING="0" WIDTH="100%">
<TR BGCOLOR="#CCCCFF" CLASS="TableHeadingColor">
<TD COLSPAN="1" class="title-cell">
Method Detail
</TD>
</TR>
</TABLE>
<!-- One single method detail entry -->
<A NAME="getAdapter"><!-- --></A>
<H3>getAdapter</H3>
<PRE>Object <B>getAdapter</B>()</PRE>
<UL>Get the adapter this SplitBar uses</UL>
<!-- METHOD PARAMETERS START -->
<!-- METHOD PARAMETERS END -->
<UL>
<B>Returns:</B>
<UL>
The adapter object
</UL>
</UL>
<!-- ADDITIONAL ATTRIBUTES START -->
<!-- ADDITIONAL ATTRIBUTES END -->
<HR>
<A NAME="getMaximumSize"><!-- --></A>
<H3>getMaximumSize</H3>
<PRE>Number <B>getMaximumSize</B>()</PRE>
<UL>Gets the maximum size for the resizing element</UL>
<!-- METHOD PARAMETERS START -->
<!-- METHOD PARAMETERS END -->
<UL>
<B>Returns:</B>
<UL>
The maximum size
</UL>
</UL>
<!-- ADDITIONAL ATTRIBUTES START -->
<!-- ADDITIONAL ATTRIBUTES END -->
<HR>
<A NAME="getMinimumSize"><!-- --></A>
<H3>getMinimumSize</H3>
<PRE>Number <B>getMinimumSize</B>()</PRE>
<UL>Gets the minimum size for the resizing element</UL>
<!-- METHOD PARAMETERS START -->
<!-- METHOD PARAMETERS END -->
<UL>
<B>Returns:</B>
<UL>
The minimum size
</UL>
</UL>
<!-- ADDITIONAL ATTRIBUTES START -->
<!-- ADDITIONAL ATTRIBUTES END -->
<HR>
<A NAME="setAdapter"><!-- --></A>
<H3>setAdapter</H3>
<PRE>void <B>setAdapter</B>(&lt;Object&gt; adapter)</PRE>
<UL>Set the adapter this SplitBar uses</UL>
<!-- METHOD PARAMETERS START -->
<UL>
<B>Parameters:</B>
<UL><CODE>adapter</CODE> - A SplitBar adapter object
</UL>
</UL>
<!-- METHOD PARAMETERS END -->
<!-- ADDITIONAL ATTRIBUTES START -->
<!-- ADDITIONAL ATTRIBUTES END -->
<HR>
<A NAME="setCurrentSize"><!-- --></A>
<H3>setCurrentSize</H3>
<PRE>void <B>setCurrentSize</B>(&lt;Number&gt; size)</PRE>
<UL>Sets the initialize size for the resizing element</UL>
<!-- METHOD PARAMETERS START -->
<UL>
<B>Parameters:</B>
<UL><CODE>size</CODE> - The initial size
</UL>
</UL>
<!-- METHOD PARAMETERS END -->
<!-- ADDITIONAL ATTRIBUTES START -->
<!-- ADDITIONAL ATTRIBUTES END -->
<HR>
<A NAME="setMaximumSize"><!-- --></A>
<H3>setMaximumSize</H3>
<PRE>void <B>setMaximumSize</B>(&lt;Number&gt; maxSize)</PRE>
<UL>Sets the maximum size for the resizing element</UL>
<!-- METHOD PARAMETERS START -->
<UL>
<B>Parameters:</B>
<UL><CODE>maxSize</CODE> - The maximum size
</UL>
</UL>
<!-- METHOD PARAMETERS END -->
<!-- ADDITIONAL ATTRIBUTES START -->
<!-- ADDITIONAL ATTRIBUTES END -->
<HR>
<A NAME="setMinimumSize"><!-- --></A>
<H3>setMinimumSize</H3>
<PRE>void <B>setMinimumSize</B>(&lt;Number&gt; minSize)</PRE>
<UL>Sets the minimum size for the resizing element</UL>
<!-- METHOD PARAMETERS START -->
<UL>
<B>Parameters:</B>
<UL><CODE>minSize</CODE> - The minimum size
</UL>
</UL>
<!-- METHOD PARAMETERS END -->
<!-- ADDITIONAL ATTRIBUTES START -->
<!-- ADDITIONAL ATTRIBUTES END -->
<HR>
<!-- ============ METHOD DETAIL END ========== -->
<!-- ========= END OF CLASS DATA ========= -->
<HR>
<FONT SIZE="-1">
</FONT>
<div class="jsdoc_ctime">Documentation generated by <a href="http://jsdoc.sourceforge.net/" target="_parent">JSDoc</a> on Sat Oct 14 06:07:10 2006</div>
</BODY>
</HTML>