docs/source/Element.scroll-more.html

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