git.roojs.org Git - roojs1/blob - docs/symbols/Roo.Element.html

   1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   2
   3
   4 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
   5
   6         <head>
   7                 <meta http-equiv="content-type" content="text/html; charset=undefined" />
   8                 <meta name="generator" content="JsDoc Toolkit" />
   9
  10
  11                 <title>JsDoc Reference - Roo.Element</title>
  12
  13
  14         <link rel="stylesheet" type="text/css" href="../../css/roojs.css" />
  15         <link rel="stylesheet" type="text/css" href="../default.css" />
  16
  17
  18         <script type="text/javascript" src="../page.js">
  19
  20         </script>
  21
  22
  23         </head>
  24
  25         <body onload="RooDocsPage.onload();">
  26
  27
  28 <div class="body-wrap">
  29
  30     <!-- ============================== links to methods. ================================= -->
  31
  32     <div class="top-tools">
  33     <!--
  34         <a class="inner-link" href="#Roo.Element-props"><img src="resources/s.gif" class="item-icon icon-prop">Properties</a>
  35         <a class="inner-link" href="#Roo.Element-methods"><img src="resources/s.gif" class="item-icon icon-method">Methods</a>
  36         <a class="inner-link" href="#Roo.Element-events"><img src="resources/s.gif" class="item-icon icon-event">Events</a>
  37         <a class="inner-link" href="#Roo.Element-configs"><img src="resources/s.gif" class="item-icon icon-config">Config Options</a>
  38         <a class="bookmark" href="NEED_TO_CREATE_DIRECT_LINK_HREF"><img src="resources/s.gif" class="item-icon icon-fav">Direct Link</a>
  39         -->
  40     </div>
  41
  42
  43 <!-- ============================== inheritance Block. ================================= -->
  44
  45 <!-- ============================== class title / details ============================ -->
  46
  47
  48     <h1 class="classTitle">
  49
  50                                 Class Roo.Element
  51                         </h1>
  52
  53     <table cellspacing="0" class="class-summary-table">
  54
  55                 <tr><td class="label">Package:</td><td class="hd-info">Roo</td></tr>
  56
  57         <tr><td class="label">Defined In:</td><td class="hd-info">
  58
  59                                         <a href="./src/Roo_Element.js.html">Roo/Element.js</a>.
  60
  61         </td></tr>
  62         <tr><td class="label">Class:</td><td class="hd-info">Element</td></tr>
  63
  64
  65         <tr><td class="label">Subclasses:</td><td class="hd-info">
  66                 <a href="./Roo.Layer.html#constructor" roo:cls="Roo.Layer.html#constructor">Roo.Layer</a>
  67
  68
  69
  70         </td></tr>
  71
  72
  73
  74     </table>
  75
  76
  77 <!-- ============================== class summary ========================== -->
  78     <div class="description">
  79         Represents an Element in the DOM.<br><br><br/>Usage:<br><br/><pre><code><br/>var el = Roo.get("my-div");<br/><br/>// or with getEl<br/>var el = getEl("my-div");<br/><br/>// or with a DOM element<br/>var el = Roo.get(myDivElement);<br/></code></pre><br/>Using Roo.get() or getEl() instead of calling the constructor directly ensures you get the same object<br/>each call instead of constructing a new one.<br><br><br/><b>Animations</b><br /><br/>Many of the functions for manipulating an element have an optional "animate" parameter. The animate parameter<br/>should either be a boolean (true) or an object literal with animation options. The animation options are:<br/><pre><br/>Option    Default   Description<br/>--------- --------  ---------------------------------------------<br/>duration  .35       The duration of the animation in seconds<br/>easing    easeOut   The YUI easing method<br/>callback  none      A function to execute when the anim completes<br/>scope     this      The scope (this) of the callback function<br/></pre><br/>Also, the Anim object being used for the animation will be set on your options object as "anim", which allows you to stop or<br/>manipulate the animation. Here's an example:<br/><pre><code><br/>var el = Roo.get("my-div");<br/><br/>// no animation<br/>el.setWidth(100);<br/><br/>// default animation<br/>el.setWidth(100, true);<br/><br/>// animation with some options set<br/>el.setWidth(100, {<br/>    duration: 1,<br/>    callback: this.foo,<br/>    scope: this<br/>});<br/><br/>// using the "anim" property to get the Anim object<br/>var opt = {<br/>    duration: 1,<br/>    callback: this.foo,<br/>    scope: this<br/>};<br/>el.setWidth(100, opt);<br/>...<br/>if(opt.anim.isAnimated()){<br/>    opt.anim.stop();<br/>}<br/></code></pre><br/><b> Composite (Collections of) Elements</b><br /><br/>For working with collections of Elements, see <a href="Roo.CompositeElement.html">Roo.CompositeElement</a>
  80     </div>
  81
  82
  83 <!-- ============================== Class comment block... ========================== -->
  84
  85 <div class="comments">
  86         <b>Class Comments / Notes</B> =>
  87         <u onclick="parent.CommentDialog.showCommentId = 'Roo.Element';">[Add Your comment/notes about this class]</u>
  88         <br/>
  89         <iframe frameborder="0"  id="comments-Roo" style="border: none;width:100%;"
  90                 src="/blog.php/GtkDjsComments/Roo.Element.html"></iframe>
  91 </div>
  92
  93
  94
  95 <!-- ============================== config options ========================== -->
  96
  97
  98
  99
 100     <div class="hr"></div>
 101     <a id="Roo.Element-configs"></a>
 102
 103
 104
 105      <table cellspacing="0" class="member-table">
 106       <caption class="Empty">Config Options - Has None</caption>
 107      </table>
 108
 109
 110
 111
 112
 113
 114
 115
 116
 117
 118
 119
 120   <!-- ============================== public properties ==================== -->
 121
 122
 123
 124     <a id="Roo.Element-props"></a>
 125
 126
 127
 128
 129
 130      <table cellspacing="0" class="member-table">
 131       <caption class="Empty">Public Properties - Has None</caption>
 132      </table>
 133
 134
 135
 136
 137   <!-- ============================== methods summary / details ======================== -->
 138
 139
 140   <a id="Roo.Element-methods"></a>
 141         <!-- constructor?? -->
 142
 143         <!-- static's first
 144
 145
 146         -->
 147
 148         <!-- then dynamics first -->
 149
 150
 151
 152
 153
 154
 155       <table cellspacing="0" class="member-table">
 156       <caption>Public Methods</caption>
 157         <tr>
 158             <th class="sig-header" colspan="2">Method</th>
 159             <th class="msource-header">Defined By</th>
 160
 161         </tr>
 162
 163
 164
 165
 166
 167
 168
 169           <tr class="method-row config-row-alt0 expandable notInherited">
 170             <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
 171
 172
 173             <td class="sig">
 174                 <a id="Roo-method-Element"   name=".Element"></a>
 175                 <div class="fixedFont">
 176                         <span class="attributes">new <B>Roo.</B></span><b class="itemname">Element</b>
 177
 178                                  (<a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>/HTMLElement <B><i>element</i></B>, <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a> <B><i>forceNew</i></B>)
 179
 180
 181
 182                 </div>
 183                 <div class="mdesc">
 184
 185
 186                         <div class="short">Create a new Roo.Element</div>
 187
 188
 189                     <div class="long">
 190
 191
 192
 193                                 Create a new Roo.Element
 194
 195
 196                                 <dl class="detailList">
 197                                 <dt class="heading">Parameters:</dt>
 198
 199                                         <dt>
 200                                                 <span class="fixedFont"><a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>/HTMLElement</span>  <b>element</b>
 201
 202                                         </dt>
 203                                         <dd></dd>
 204
 205                                         <dt>
 206                                                 <span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a></span>  <b>forceNew</b>
 207
 208                                         </dt>
 209                                         <dd>(optional) By default the constructor checks to see if there is already an instance of this element in the cache and if there is it returns the same instance. This will skip that check (useful for extending this class).</dd>
 210
 211                                 </dl>
 212
 213
 214
 215
 216
 217
 218
 219
 220
 221
 222
 223                     </div>
 224                 </div>
 225
 226             </td>
 227             <td class="msource">
 228                 &nbsp;
 229             </td>
 230         </tr>
 231
 232
 233     </table>
 234
 235
 236   <!-- ============================== events summary / details ======================== -->
 237
 238
 239   <a id="Roo.Element-events"></a>
 240
 241
 242
 243
 244
 245      <table cellspacing="0" class="member-table">
 246       <caption class="Empty">Events - Has None</caption>
 247      </table>
 248
 249
 250
 251
 252
 253
 254
 255
 256
 257 <!-- ============================== footer ================================= -->
 258                 <div class="fineprint" style="clear:both">
 259
 260                         Documentation generated by <a href="http://www.akbkhome.com" target="_blankt">Introspection Doc Generator</a>  on Thu Jul 22 2010 10:38:32 GMT+0800 (HKT)
 261                         Based on
 262                         <a href="http://www.jsdoctoolkit.org/" target="_blank">JsDoc Toolkit</a>
 263                 </div>
 264         </body>
 265 </html>