docs/source/Element.scroll-more.html

   1 <html>\r
   2 <head>\r
   3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    \r
   4   <title>The source code</title>\r
   5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
   6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
   7 </head>\r
   8 <body  onload="prettyPrint();">\r
   9     <pre class="prettyprint lang-js">/**\r
  10  * @class Ext.Element\r
  11  */\r
  12 Ext.Element.addMethods({\r
  13     <div id="method-Ext.Element-scrollTo"></div>/**\r
  14      * Scrolls this element the specified scroll point. It does NOT do bounds checking so if you scroll to a weird value it will try to do it. For auto bounds checking, use scroll().\r
  15      * @param {String} side Either "left" for scrollLeft values or "top" for scrollTop values.\r
  16      * @param {Number} value The new scroll value\r
  17      * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object\r
  18      * @return {Element} this\r
  19      */\r
  20     scrollTo : function(side, value, animate){\r
  21         var top = /top/i.test(side), //check if we're scrolling top or left\r
  22                 me = this,\r
  23                 dom = me.dom,\r
  24             prop;\r
  25         if (!animate || !me.anim) {\r
  26             prop = 'scroll' + (top ? 'Top' : 'Left'), // just setting the value, so grab the direction\r
  27             dom[prop] = value;\r
  28         }else{\r
  29             prop = 'scroll' + (top ? 'Left' : 'Top'), // if scrolling top, we need to grab scrollLeft, if left, scrollTop\r
  30             me.anim({scroll: {to: top ? [dom[prop], value] : [value, dom[prop]]}},\r
  31                          me.preanim(arguments, 2), 'scroll');\r
  32         }\r
  33         return me;\r
  34     },\r
  35     \r
  36     <div id="method-Ext.Element-scrollIntoView"></div>/**\r
  37      * Scrolls this element into view within the passed container.\r
  38      * @param {Mixed} container (optional) The container element to scroll (defaults to document.body).  Should be a\r
  39      * string (id), dom node, or Ext.Element.\r
  40      * @param {Boolean} hscroll (optional) False to disable horizontal scroll (defaults to true)\r
  41      * @return {Ext.Element} this\r
  42      */\r
  43     scrollIntoView : function(container, hscroll){\r
  44         var c = Ext.getDom(container) || Ext.getBody().dom,\r
  45                 el = this.dom,\r
  46                 o = this.getOffsetsTo(c),\r
  47             l = o[0] + c.scrollLeft,\r
  48             t = o[1] + c.scrollTop,\r
  49             b = t + el.offsetHeight,\r
  50             r = l + el.offsetWidth,\r
  51                 ch = c.clientHeight,\r
  52                 ct = parseInt(c.scrollTop, 10),\r
  53                 cl = parseInt(c.scrollLeft, 10),\r
  54                 cb = ct + ch,\r
  55                 cr = cl + c.clientWidth;\r
  56 \r
  57         if (el.offsetHeight > ch || t < ct) {\r
  58                 c.scrollTop = t;\r
  59         } else if (b > cb){\r
  60             c.scrollTop = b-ch;\r
  61         }\r
  62         c.scrollTop = c.scrollTop; // corrects IE, other browsers will ignore\r
  63 \r
  64         if(hscroll !== false){\r
  65                         if(el.offsetWidth > c.clientWidth || l < cl){\r
  66                 c.scrollLeft = l;\r
  67             }else if(r > cr){\r
  68                 c.scrollLeft = r - c.clientWidth;\r
  69             }\r
  70             c.scrollLeft = c.scrollLeft;\r
  71         }\r
  72         return this;\r
  73     },\r
  74 \r
  75     // private\r
  76     scrollChildIntoView : function(child, hscroll){\r
  77         Ext.fly(child, '_scrollChildIntoView').scrollIntoView(this, hscroll);\r
  78     },\r
  79     \r
  80     <div id="method-Ext.Element-scroll"></div>/**\r
  81      * Scrolls this element the specified direction. Does bounds checking to make sure the scroll is\r
  82      * within this element's scrollable range.\r
  83      * @param {String} direction Possible values are: "l" (or "left"), "r" (or "right"), "t" (or "top", or "up"), "b" (or "bottom", or "down").\r
  84      * @param {Number} distance How far to scroll the element in pixels\r
  85      * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object\r
  86      * @return {Boolean} Returns true if a scroll was triggered or false if the element\r
  87      * was scrolled as far as it could go.\r
  88      */\r
  89      scroll : function(direction, distance, animate){\r
  90          if(!this.isScrollable()){\r
  91              return;\r
  92          }\r
  93          var el = this.dom,\r
  94             l = el.scrollLeft, t = el.scrollTop,\r
  95             w = el.scrollWidth, h = el.scrollHeight,\r
  96             cw = el.clientWidth, ch = el.clientHeight,\r
  97             scrolled = false, v,\r
  98             hash = {\r
  99                 l: Math.min(l + distance, w-cw),\r
 100                 r: v = Math.max(l - distance, 0),\r
 101                 t: Math.max(t - distance, 0),\r
 102                 b: Math.min(t + distance, h-ch)\r
 103             };\r
 104             hash.d = hash.b;\r
 105             hash.u = hash.t;\r
 106             \r
 107          direction = direction.substr(0, 1);\r
 108          if((v = hash[direction]) > -1){\r
 109             scrolled = true;\r
 110             this.scrollTo(direction == 'l' || direction == 'r' ? 'left' : 'top', v, this.preanim(arguments, 2));\r
 111          }\r
 112          return scrolled;\r
 113     }\r
 114 });</pre>    \r
 115 </body>\r
 116 </html>