À.¸ï&1|?"{}:+dª“Ät	»Þéö4BÔE…“³n!‚3Í_±È${íE³Ú6í|¤²èëTŸI³š]î¬æÌò
òZ½\U‘ÙÍ¡]ûSÿmwÉ%CåÏÝRJ‹hþJC«³<Måà® ¶ê¯ºh­ø*Y¨òDy,i^'
/Œ9¿®Žõõÿp–½_‰ÙÙK­#âØ¶¯þe%5^Ä´ÛM[:ù;,{ûÇ¥ÀÞíçª‹-	žÔFô
qæâ@30¼»bÎØÌl­ÀÛö¯KÔOBYá¿ÃL”<õXe)4)™ØM§.)¨fà”[Â7 ¨D¶@ïµ\+ Ê³DAÏ‘ëçQlß¡…“jJm2Yi€Pú˜Ã"#˜¨ö¤ø0„N!¼²'Çx:GrE¶zÙ¿p?Ž$±Xb41yqøß‰ôö‡’GkD2&¹oêqqjlâÚ£^ç[}W^†¬(–‹ae),t¿	S½¡"ÇÝÝ½>ÍZÔëúÐ¾_[4­5RÛP¥_@V}úÎÍèw‡”Jß­RXF’Ê¡ÄG ÔPÙê6,«OU-]É=Ryß£ï’jšäuxý	W@±zár?Œ„†`B}öÀÄ½ßTÒAÊ|>¤NŸqª4Ž€ëÎø°}»,Z=K¶ÙÙº¼òEf|œsZ¡6J,q–îw‰ÿKÛ°^VsE‹¯mVIs¸Ï’*2Ãc”u—ÎæÎìDœýQá(ÃÞ™Ë£Ôoe@%J¡ aL œ{lqë‡/á¢A÷…'#+½E€]ÒN§fŠ9«poíöoåjDÞQÝe£#C¬ƒ>8àâF‚P©(ö“"d{LâËÇ$D±0†_X	dóŒfÆ-'8Ðñ»œdclÄÙ¾o5¨»Õ+Ü	SV§ô	Ka@:LIóV1t;ÌÀ³ÞÊp±A9XE™øE•Î°6ºU½&r¦wÞ@SõÙÓêèT_ÿX]Ë riÍ—Ûý-æS§ºÀÞŸëÝÂ[îV#>)[ÊºN³ŸÞ¯‹+hÏaµ9«ô¢öO;Ì•+Ôd q ×vHÎÐè/a#[@æf,]€OM	À9Òdôù„À\Ë+ÕÌâ) àb%@ÀñO|¯åf;ºêòOT€ÛcÎŠ^.ÙŽ}Bj€,þ6õh'±‘Ôùûêw'"­fåTð!ët†N“®>‹íl}²ÀDÚ´Ÿ÷fi‹$Ô=2—a*£Ææéc¥dõ‡ÍéË˜´|ÖÐÂ´GÞ2By?¦=NùÍ-`¬h–UÍçÐ¤G%î2Ö±	ÜæggÄÏæ‡œ´	¹u€Ø¹93¾¸ŸÁ,ùÿ­ËîƒÐç"I‰Žª[q1mÔ3 ü=¾DÌç’ý´ùçÝ÷ãEä“±ìªŒµ‰ð z{ÄM²ŸóÀ6Õü–ªçWhyT¡
¹·ôÐêÕÅ
)D7aù×ÅðâýÞ"V“ ÿÿ³Ç¹¾R3û}àõ`±U"àüÐ/yŒ%Ø	eqæ4.,´Ç ÿÏU\¦¯|WŒ¡ŠtK§K&¯¦ë˜†Ýèk=„;$I˜½ýIÑ'ôfÖsg)£SQãõhÍö}ã’PR{à_±Ó¹ç>|<‰. Û7Ê¨Mc4øFß8nš<–™m^‚i[‹]RÙµ/Å1ë€ZÍ©úÏÍ¸2*ø£ÛÍP˜‹£d	8ñÁÔ¶Õikšx&Ó*èe.Áôu^Ùè(DÎjÑÄÚ"b3Ó¢Š‰ÂGçØÍÀ2q4yZÎWcò˜8×Ä>ïöã´ÔöXÒzNNFžÊ,ßù.Ù×ATC;¸jtÂÝHµ§„C\oÎ'Žù.&)TàOjÿë1æ9ä@ºâX}"†e	ezƒM<ŒDrd¯C|J£ì@ÅküP$IÍ¡[ÀÉ*ú…˜ŽiÛš~ý\%Kèpñ—À×Î¾j8÷ðvÚ!+ñaFR6…š Åo™wä–¥ªž
pE3Ù´U’–}êT8tqÚ1÷Ãœ}Ü3¸’hóV^v7  +»Ýì }¡mM¬*ˆ÷w3U–`Ó{]Rñ“K&SîÛ<µÎ³áy2Í‰ì.šû³*‘!Á]âÞ‰dâØi÷~4'	ôìíÖ5ªQ¯ô9ü‘ZLÎ•° ì%h¸$!Ñ/
Ì2ûýSíÕNŸµt^sz9vo!É°zö­žaG´½˜vZ×!vžRî6öÓ$˜¼’µ¬“`×>¦µ“Å24L82Ñ¸ï§kÙÑ¬À!þ¯T°ŠÀâ²k,Ôõa8³oT3ýù‚øáá#ƒ‚þ[Yp°^ÎAæb‹wÉ^/qŸò –ÜËäàXC@[ÎçÓ”Î`ÈFSPe¡×\Æï§^ÀMWüÌåûc)®Lï˜áº„”Zëòåæú/Æ„˜'¸Û±1ó!^ºicqJ]ÏØeèzÁë4ÚöÄ‰¹ŠËI«&I˜ä¡ÔAÀÿŸÏß\Â“ëž}o\ã³µ5³ž—»Î¹’Ñ%wâ—ŒÉ«³‘&;ÇóÎ|+1…€èXÀtÌBë¥Ú@†ÿxºªeƒµìZDYs?àñs-³
¸. ŸÚ3Eß7’Ü¿=“É€Õ^þðüï°S «õY	®`¼A!‚Ñ®&¦j²¶ýV€Úqº7òä¢Õµcrübw‰OÁb.–’@•ØçÕÑrùðö¿ 6#R7QôÊ0T)[öÞ©#ô’X´µße
%R­#ú¢Òî?ÇçµŸÛC	%¸Á—½]“Š l0¡zy¨o¼&ˆ%¸‰Ï…ÊJƒ¡À_ùôC‡½„¢Î	,ŸŠ…ZRN—Ù(f7ÌV6Y¾T¡J„i¬P!Q³«­§éx¢Ñéð¸`ÇCù@øâœõy‘d’áO€- ßLÂûB¬v†‰bIPp¬R"ëóÓ#ç¨*àBódŸ–ËJ4QÈwÕ[RÌ"´‘	kz›×8£ú <ëx¹šK£·Ç/vËá3ì°&¬u`žáÌÝÔ|¤i½ÃbÚÎ’•ËY¤ çòŽP1ébZËp'»BÞ/§óL|PÞS&ÑN³¢Œ\«yÿiE¬¢Û±´…{¾‡xAŽCÀÍMEá\˜¢ŠÐâöGmR}”Ÿu0ƒ/[r‚±Çk{QÏpçf"ØÚgÊOï^Æï¯`t+›Ò¦,ú¬ûöIW<Sú_øg˜ãI$DÿÑ	Õ¤Þ¡;lLT4¤ÜYÄ‘ÒÌˆ!“p\N
j·tº9ËAÄ;Èm\aÁ4o€AÎÜ¤¢$©vËUgË/|˜EÏs¯)ña{“ë„Ý°gã"Fgdø$p­g_÷e1Œ%&žÛ“~RÈh“÷ŽÙüëZÜ™ˆ9TËî±ÂFƒ²¯{Ãÿ¯Åö¢?¥LF¦‹P£dŒFÑ µ)Æô¸¥›÷£Að~Üp´û%²úB`2í~WÛ¦´AOŠÙH¯º-·éyk–½Ÿ6‚úF0Y±ËÅá2œ¬Î4<Ë~;‚Å/å<fŸ8žúóïq¸$“A_™õ»=/Ac$Ðš¡í¬e¦Îl.ï3'+Ú"®÷xsäúsÚ†8#èŸÏ¶n‰E`ç†ªr]<–Íü+&ÔxX¡áGÐ³z3mè"¹ÙÖoá;¸y÷}ÏÊè÷ßKY^Ã+º@vÂ`@R,Å÷ÀvËØ0çvÁÄ]édù…Ø¨KyÍ|ƒ$ybˆ5í·K<F•£ï·8šQè€È†b|É‹aH*ÍH:Òøˆ“iÒ³;0ò-£ÔÉÛEK	?L,Øt•W––Ùøyj?3Rª°Rt…«6X>‘!é%ˆ‘¿áâuYMbkI¶œâÑgùÈÿäÂ¹ÅÓBQ#*S½_MmóM“æ³çõ.Á¿™«IUø7&Y·YõÀ×œ=F(Ÿ`åï'8Ñ‡‰òŒŠäJ@zì¤õbƒl@+Qá7´NWôvy^p®M½"ÉHê[C‚fMÄ3Á0!™}IÑ´ÅÅC"4&´éR‡ÂÃ4é‰»…Šàÿ{v— vr{[&iÖ·~˜ŽMvJ«¹ÅTÄ·Âä«ºé9‰’±qê—Ëewð?½ ›Xá>xñ]ÏØeèzÁë4ÚöÄ‰¹Š†ÆÝ9ª‰ÆËÓÊà×^·‰Á,èbÎïM‘‚ ‹¡K­6¬öíÛ*7¾8WÖn§Õw,k.Y÷etÒÑ´x°jpmU+«/zÏDòÚÖÞÿÛ'¤ùÁF±-'†7—áJø"Q÷ã%%Y½E{‡l°¹®âß¥Ãû£Ä·ªV'µ±òús\£®*õ6MÃÛÙ6„÷¿ñ¬~†šZX³jšT^+gqž0=NÞ«ÉõïYSô#¶Y0à¸ó~! ü¿÷dl3×a-u)ÌÓµìËb÷;:tßU…úªf'·Û®în ´V¸ÈoÐ.½OÛAÙAÛª¬[ØÕÞ‹C›Ü»ónm‚š'Õ¼aáöí…ëj¢Ù}RB6÷ŽÙüëZÜ™ˆ9TËî±ÂFƒ²¯{Ãÿ¯Åö¢?¥LF|<g–˜½Xë¤¨Úéû°˜¿×ò·‹Õ÷È›UQVöff>K­­jÿ)ýAÿébøâö9)ª(:.º``ôg~‘n÷Ia‡’ŸwfÊ>ü‡@Œ(àÜ|•:ìùxõõáO8ÌýDòK¡Ï@XË1c$‹9…nÀ×2ÚÄ«@ôdXaþ3 Ð¼M6!<ûtº9ËAÄ;Èm\aÁ4ªBE)lÙ¢×ésªº¡©7çÌ]^(Æ¾{ÿ­Lí²0r†­š„U¦.H‰ú3¨ü$aÊr“,ŸSÝC@ýÑ-;Ãtæäi;Í…l’…‘£ðØÉÔçu ·sQ¨ê5_\–ÅÁ&WaEæV¦ëáe@‡=úGa—«ª¤™-<ÀaÅWÕ*È¤àóŒ˜¹j3¶¢æ)0^º.wv¹kl˜7X~<^.,¤SRj‰sDUýu@açëÆGÀëhHSöà%ÔóXþ/—’œÊí’_›@¹ù•¸RºE©:†Ôñ>ldéaÞ³%&ïL®éÑB«—‘èN¢¦	èIuKÄ&@DÃK¤0_*)Ò]9e½1)eßwÀA˜ûM–´GøL±bÈå#Çä:ôõV”àã»¹v¤Þ¸¸³@)Å^>§q[ÃNöØŽ&`Ý‡oná®ê½MÊ!¸ixç2ÍÒ—Þ«ç-ÁÔ¸ç¿ô¿œ»=‰˜ÇçµŸÛC	%¸Á—½]“Š l0¡zy¨o¼&ˆ%¸ðx+ÄÂdší'`Æ9_r});</code></pre>
							<p>
								Get the <code>closeDelay</code> property.
							</p>
							<pre><code>var closeDelay = $('#jqxDropDownButton').jqxDropDownButton('closeDelay');</code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/KS2fL/">closeDelay is set to 2000</a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span22'>disabled</span>
					</td>
					<td>
						<span>Boolean</span>
					</td>
					<td>false
					</td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Enables or disables the dropDownButton.
							</p>
							<h4>Code examples</h4>
							<p>
								Set the <code>disabled</code> property.
							</p>
							<pre><code>$('#jqxDropDownButton').jqxDropDownButton({disabled: false });</code></pre>
							<p>
								Get the <code>disabled</code> property.
							</p>
							<pre><code>var disabled = $('#jqxDropDownButton').jqxDropDownButton('disabled');</code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/8rqtD/">disabled is set to true</a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span29'>dropDownHorizontalAlignment</span>
					</td>
					<td>
						<span>String</span>
					</td>
					<td>'left'
					</td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Sets or gets the DropDown's alignment.
							</p>
							<b>Possible values: </b>
							<br />
							<pre><code>'left' </code></pre>
							<pre><code>'right'</code></pre>
							<h4>Code example</h4>
							<pre><code>$('#jqxDropDownButton').jqxDropDownButton({ dropDownHorizontalAlignment: 'right'}); </code></pre>
							<p>
								Get the <code>dropDownHorizontalAlignment</code> property.
							</p>
							<pre><code>var dropDownHorizontalAlignment = $('#jqxDropDownButton').jqxDropDownButton('dropDownHorizontalAlignment');</code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/LShym/">dropDownHorizontalAlignment is set to 'right'</a>
							</div>
						</div>
					</td>
				</tr>
             <tr>
                    <td class="documentation-option-type-click">
                        <span id='Span85'>dropDownVerticalAlignment</span>
                    </td>
                    <td>
                        <span>String</span>
                    </td>
                    <td>'bottom'
                    </td>
                </tr>
                <tr>
                    <td colspan='3' style='width: 100%'>
                        <div class="documentation-option-description property-content" style="display: none;">
                            <p>
                                Sets or gets the DropDown's alignment.
                            </p>
                            <b>Possible Values:</b>
                            <br />
                            <pre><code>'top'</code></pre>
                            <pre><code>'bottom'</code></pre>
                            <h4>Code example</h4>
                            <pre><code>$('#jqxDropDownButton').jqxDropDownButton({ dropDownVerticalAlignment: 'top'}); </code></pre>
                            <p>
                                Get the <code>dropDownVerticalAlignment</code> property.
                            </p>
                            <pre><code>var dropDownVerticalAlignment = $('#jqxDropDownButton').jqxDropDownButton('dropDownVerticalAlignment');</code></pre>
                            <div style="padding-bottom: 5px;">
                                <em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/yg1dp2fb/">dropDownVerticalAlignment is set to "top"</a>
                            </div>
                        </div>
                    </td>
                </tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span28'>enableBrowserBoundsDetection</span>
					</td>
					<td>
						<span>Boolean</span>
					</td>
					<td>false
					</td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								When this property is set to true, the popup may open
																					above the button, if there's not enough available space below the button.
							</p>
							<h4>Code example</h4>
							<p>
								Set the <code>enableBrowserBoundsDetection</code>
								property.
							</p>
							<pre><code>$('#jqxDropDownButton').jqxDropDownButton({ enableBrowserBoundsDetection: false}); </code></pre>
							<p>
								Get the <code>enableBrowserBoundsDetection</code> property.
							</p>
							<pre><code>var enableBrowserBoundsDetection = 
$('#jqxDropDownButton').jqxDropDownButton('enableBrowserBoundsDetection');</code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/4eTCk/">enableBrowserBoundsDetection is set to true</a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span23'>height</span>
					</td>
					<td>
						<span>Number/String</span>
					</td>
					<td>null
					</td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Sets or gets the button's height.
							</p>
							<h4>Code examples</h4>
							<p>
								Set the <code>height</code> property.
							</p>
							<pre><code>$('#jqxDropDownButton').jqxDropDownButton({ height: '25px' }); </code></pre>
							<p>
								Get the <code>height</code> property.
							</p>
							<pre><code>var height = $('#jqxDropDownButton').jqxDropDownButton('height');</code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/LLJEV/">height is set to 19</a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span60'>initContent</span>
					</td>
					<td>
						<span>Function</span>
					</td>
					<td>null
					</td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Sets a function which initializes the button's content.
							</p>
							<h4>Code examples</h4>
							<p>
								Set the <code>initContent</code> property.
							</p>
							<pre><code>$('#jqxDropDownButton').jqxDropDownButton({ initContent: function() { }}); </code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/o10v3wr3/">initContent is set</a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span30'>openDelay</span>
					</td>
					<td>
						<span>Number</span>
					</td>
					<td>350
					</td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Sets or gets the delay of the 'open' animation.
							</p>
							<h4>Code example</h4>
							<p>Set the  <code>openDelay</code> property</p>
							<pre><code>$('#jqxDropDownButton').jqxDropDownButton({openDelay: 200});</code></pre>
							<p>Get the <code>openDelay</code> property.</p>
							<pre><code>var openDelay = $('#jqxDropDownButton').jqxDropDownButton('openDelay');</code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/Psfj5/">openDelay is set to 2000</a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span73'>popupZIndex</span>
					</td>
					<td>
						<span>Number</span>
					</td>
					<td>20000
					</td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Sets or gets the popup's z-index.
							</p>
							<h4>Code example</h4>
							<p>
								Set the <code>popupZIndex</code> property.
							</p>
							<pre><code>$("#jqxDropDownButton").jqxDropDownButton({popupZIndex: 999999});</code></pre>
							<p>
								Get the <code>popupZIndex</code> property.
							</p>
							<pre><code>var zIndex = $('#jqxDropDownButton').jqxDropDownButton('popupZIndex'); </code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/GZk2h/">popupZIndex is set to 999999</a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span25'>rtl</span>
					</td>
					<td>
						<span>Boolean</span>
					</td>
					<td>false
					</td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>Sets or gets a value indicating whether widget's elements are aligned to support locales using right-to-left fonts.</p>
							<h4>Code example</h4>
							<p>
								Set the <code>rtl</code> property.
							</p>
							<pre><code>$('#jqxDropDownButton').jqxDropDownButton({rtl : true}); </code></pre>
							<p>
								Get the <code>rtl</code> property.
							</p>
							<pre><code>var rtl = $('#jqxDropDownButton').jqxDropDownButton('rtl'); </code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/jmTwk/">rtl is set to true</a>
							</div>
						</div>
					</td>
				</tr>
         	<tr>
				<td class="documentation-option-type-click">
					<span id='Span86'>template</span>
				</td>
				<td>
					<span>String</span>
				</td>
				<td>'default'
				</td>
			</tr>
			<tr>
				<td colspan='3' style='width: 100%'>
					<div class="documentation-option-description property-content" style="display: none;">
						<p>
							Determines the template as an alternative of the default styles.
						</p>
						<b>Possible Values:</b>
						<br />
						<pre><code>'default' - the default template. The style depends only on the "theme" property value.</code></pre>
						<pre><code>'primary' - dark blue style for extra visual weight.</code></pre>
						<pre><code>'success' - green style for successful or positive action.</code></pre>
						<pre><code>'warning' - orange style which indicates caution.</code></pre>
						<pre><code>'danger' - red style which indicates a dangerous or negative action.</code></pre>
						<pre><code>'info' - blue button, not tied to a semantic action or use.</code></pre>
						<h4>Code examples</h4>
						<p>
							Set the <code>template</code> property.
						</p>
						<pre><code>$("#jqxDropDownButton").jqxDropDownButton({ template: 'primary'});</code></pre>

						<p>
							Get the <code>template</code> property.
						</p>
						<pre><code>var template = $('#jqxDropDownButton').jqxDropDownButton('template');</code></pre>
						<div style="padding-bottom: 5px;">
							<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/c675Lngu/">template is set to 'success'</a>
						</div>

					</div>
				</td>
			</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span26'>theme</span>
					</td>
					<td>
						<span>String</span>
					</td>
					<td>''
					</td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Sets the widget's theme.
							</p>
							jQWidgets uses a pair of css files - jqx.base.css and jqx.[theme name].css. The base stylesheet creates the styles related to the widget's layout like margin, padding, border-width, position. The second css file applies the widget's colors and backgrounds. The jqx.base.css should be included before the second CSS file.
																				In order to set a theme, you need to do the following:
																				<ul>
																					<li>Include the theme's CSS file after jqx.base.css.<br />
																						The following code example adds the 'energyblue' theme.
																						<pre><code>
<pre><code>&lt;link rel=&quot;stylesheet&quot; href=&quot;../../jqwidgets/styles/jqx.base.css&quot; type=&quot;text/css&quot; /&gt;
&lt;link rel=&quot;stylesheet&quot; href=&quot;../../jqwidgets/styles/jqx.energyblue.css&quot; type=&quot;text/css&quot; /&gt;
</code></pre>
</code></pre>
																					</li>
																					<li>Set the widget's theme property to 'energyblue' when you initialize it.
																					</li>
																				</ul>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/rpvcC/">theme is set to 'energyblue'</a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span24'>width</span>
					</td>
					<td>
						<span>Number/String</span>
					</td>
					<td>null
					</td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Sets or gets the button's width.
							</p>
							<h4>Code examples</h4>
							<p>
								Set the <code>width</code> property.
							</p>
							<pre><code>$('#jqxDropDownButton').jqxDropDownButton({ width: '250px'}); </code></pre>
							<p>
								Get the <code>width</code> property.
							</p>
							<pre><code>var width = $('#jqxDropDownButton').jqxDropDownButton('width');</code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/RhBkq/">width is set to 150</a>
							</div>
						</div>
					</td>
				</tr>

				<tr>
					<td colspan='3' style='width: 100%'>
						<h2 class="documentation-top-header">Events</h2>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span47'>close</span>
					</td>
					<td>
						<span>Event</span>
					</td>
					<td></td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								This event is triggered when the button's popup is closed.
							</p>
							<h4>Code examples</h4>
							<p>
								Bind to the <code>close</code> event by type: jqxDropDownButton.
							</p>
							<pre><code>$('#jqxDropDownButton').on('close', function () { // Some code here. }); </code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/Busec/">Bind to the close event by type: jqxDropDownButton.</a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span46'>open</span>
					</td>
					<td>
						<span>Event</span>
					</td>
					<td></td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								This event is triggered when the button's popup is opened.
							</p>
							<h4>Code examples</h4>
							<p>
								Bind to the <code>open</code> event by type: jqxDropDownButton.
							</p>
							<pre><code>$('#jqxDropDownButton').on('open', function () { // Some code here. }); </code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/jvbwx/">Bind to the open event by type: jqxDropDownButton.</a>
							</div>
						</div>
					</td>
				</tr>

				<tr>
					<td colspan='3' style='width: 100%'>
						<h2 class="documentation-top-header">Methods</h2>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span57'>close</span>
					</td>
					<td>
						<span>Method</span>
					</td>
					<td></td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Hides the button's content.
							</p>
							<div class="methodArgs">
								<table class="arguments">
									<tbody>
										<tr>
											<th>Parameter</th>
											<th>Type</th>
											<th>Description</th>
										</tr>
										<tr>
											<td><em>None</em></td>
											<td></td>
											<td></td>
										</tr>
									</tbody>
								</table>
								<strong>Return Value</strong><br />
								<em>None</em>
							</div>
							<h4>Code examples</h4>
							<p>
								Invoke the <code>close</code> method.
							</p>
							<pre><code>$('#jqxDropDownButton').jqxDropDownButton('close'); </code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/U3kAq/">closes the jqxDropDownButton </a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span68'>destroy</span>
					</td>
					<td>
						<span>Method</span>
					</td>
					<td></td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Destroys the widget.
							</p>
							<div class="methodArgs">
								<table class="arguments">
									<tbody>
										<tr>
											<th>Parameter</th>
											<th>Type</th>
											<th>Description</th>
										</tr>
										<tr>
											<td><em>None</em></td>
											<td></td>
											<td></td>
										</tr>
									</tbody>
								</table>
								<strong>Return Value</strong><br />
								<em>None</em>
							</div>
							<h4>Code examples</h4>
							<p>
								Invoke the <code>destroy</code> method.
							</p>
							<pre><code>$('#jqxDropDownButton').jqxDropDownButton('destroy'); </code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/XpFYG/">destroys the jqxDropDownButton </a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span58'>focus</span>
					</td>
					<td>
						<span>Method</span>
					</td>
					<td></td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Focuses the widget.
							</p>
							<div class="methodArgs">
								<table class="arguments">
									<tbody>
										<tr>
											<th>Parameter</th>
											<th>Type</th>
											<th>Description</th>
										</tr>
										<tr>
											<td><em>None</em></td>
											<td></td>
											<td></td>
										</tr>
									</tbody>
								</table>
								<strong>Return Value</strong><br />
								<em>None</em>
							</div>
							<h4>Code examples</h4>
							<p>
								Invoke the <code>focus</code> method.
							</p>
							<pre><code>$('#jqxDropDownButton').jqxDropDownButton('focus'); </code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/XpFYG/">focuses the jqxDropDownButton </a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span>getContent</span>
					</td>
					<td>
						<span>Method</span>
					</td>
					<td></td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Gets the button's content. The returned value is the button's content set through the "setContent" method.
							</p>
							<div class="methodArgs">
								<table class="arguments">
									<tbody>
										<tr>
											<th>Parameter</th>
											<th>Type</th>
											<th>Description</th>
										</tr>
										<tr>
											<td><em>None</em></td>
											<td></td>
											<td></td>
										</tr>
									</tbody>
								</table>
								<strong>Return Value</strong><br />
								<em>Object</em> - jQuery object.
							</div>
							<h4>Code examples</h4>
							<p>
								Invoke the <code>getContent</code> method.
							</p>
							<pre><code>var content = $('#jqxDropDownButton').jqxDropDownButton('getContent'); </code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/5G8nf/">gets the content of the jqxDropDownButton</a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span71'>isOpened</span>
					</td>
					<td>
						<span>Method</span>
					</td>
					<td></td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Returns true, if the drop down is opened. Otherwise returns false.
							</p>
							<div class="methodArgs">
								<table class="arguments">
									<tbody>
										<tr>
											<th>Parameter</th>
											<th>Type</th>
											<th>Description</th>
										</tr>
										<tr>
											<td><em>None</em></td>
											<td></td>
											<td></td>
										</tr>
									</tbody>
								</table>
								<strong>Return Value</strong><br />
								<em>Boolean</em>
							</div>
							<h4>Code example</h4>
							<p>
								Invoke the <code>isOpened</code> method.
							</p>
							<pre><code>var opened = $("#jqxDropDownButton").jqxDropDownButton('isOpened' ); </code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/wn2ef/">determins whether the popup is opened</a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span56'>open</span>
					</td>
					<td>
						<span>Method</span>
					</td>
					<td></td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Shows the button's content.
							</p>
							<div class="methodArgs">
								<table class="arguments">
									<tbody>
										<tr>
											<th>Parameter</th>
											<th>Type</th>
											<th>Description</th>
										</tr>
										<tr>
											<td><em>None</em></td>
											<td></td>
											<td></td>
										</tr>
									</tbody>
								</table>
								<strong>Return Value</strong><br />
								<em>None</em>
							</div>
							<h4>Code examples</h4>
							<p>
								Invoke the <code>open</code> method.
							</p>
							<pre><code>$('#jqxDropDownButton').jqxDropDownButton('open'); </code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/r7xqe/">opens the jqxDropDownButton </a>
							</div>
						</div>
					</td>
				</tr>
				<tr>
					<td class="documentation-option-type-click">
						<span id='Span49'>setContent</span>
					</td>
					<td>
						<span>Method</span>
					</td>
					<td></td>
				</tr>
				<tr>
					<td colspan='3' style='width: 100%'>
						<div class="documentation-option-description property-content" style="display: none;">
							<p>
								Sets the button's content. The parameter could be a "string" or "html".
							</p>
							<div class="methodArgs">
								<table class="arguments">
									<tbody>
										<tr>
											<th>Parameter</th>
											<th>Type</th>
											<th>Description</th>
										</tr>
										<tr>
											<td><em>content</em></td>
											<td>String</td>
											<td></td>
										</tr>
									</tbody>
								</table>
								<strong>Return Value</strong><br />
								<em>None</em>
							</div>
							<h4>Code examples</h4>
							<p>
								Invoke the <code>setContent</code> method.
							</p>
							<pre><code>$('#jqxDropDownButton').jqxDropDownButton('setContent', 'my content'); </code></pre>
							<div style="padding-bottom: 5px;">
								<em>Try it:</em> <a target="_blank" href="http://jsfiddle.net/jqwidgets/LW22H/">sets the content of the jqxDropDownButton</a>
							</div>
						</div>
					</td>
				</tr>

			</table>
			<br />
		</div>

	</div>
 </body>
</html>