3 This file is part of Ext JS 4
5 Copyright (c) 2011 Sencha Inc
7 Contact: http://www.sencha.com/contact
9 GNU General Public License Usage
10 This file may be used under the terms of the GNU General Public License version 3.0 as published by the Free Software Foundation and appearing in the file LICENSE included in the packaging of this file. Please review the following information to ensure the GNU General Public License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html.
12 If you are unsure which license is appropriate for your use, please contact the sales department at http://www.sencha.com/contact.
18 Ext.override(Ext.Element, {
20 * Returns true if this element is scrollable.
23 isScrollable : function(){
25 return dom.scrollHeight > dom.clientHeight || dom.scrollWidth > dom.clientWidth;
29 * Returns the current scroll position of the element.
30 * @return {Object} An object containing the scroll position in the format {left: (scrollLeft), top: (scrollTop)}
32 getScroll : function() {
36 docElement = doc.documentElement,
41 if (d == doc || d == body) {
42 if (Ext.isIE && Ext.isStrict) {
43 l = docElement.scrollLeft;
44 t = docElement.scrollTop;
46 l = window.pageXOffset;
47 t = window.pageYOffset;
50 left: l || (body ? body.scrollLeft : 0),
51 top : t || (body ? body.scrollTop : 0)
64 * 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().
65 * @param {String} side Either "left" for scrollLeft values or "top" for scrollTop values.
66 * @param {Number} value The new scroll value
67 * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
68 * @return {Ext.Element} this
70 scrollTo : function(side, value, animate) {
71 //check if we're scrolling top or left
72 var top = /top/i.test(side),
77 if (!animate || !me.anim) {
78 // just setting the value, so grab the direction
79 prop = 'scroll' + (top ? 'Top' : 'Left');
83 if (!Ext.isObject(animate)) {
86 obj['scroll' + (top ? 'Top' : 'Left')] = value;
87 me.animate(Ext.applyIf({
95 * Scrolls this element into view within the passed container.
96 * @param {String/HTMLElement/Ext.Element} container (optional) The container element to scroll (defaults to document.body). Should be a
97 * string (id), dom node, or Ext.Element.
98 * @param {Boolean} hscroll (optional) False to disable horizontal scroll (defaults to true)
99 * @return {Ext.Element} this
101 scrollIntoView : function(container, hscroll) {
102 container = Ext.getDom(container) || Ext.getBody().dom;
104 offsets = this.getOffsetsTo(container),
106 left = offsets[0] + container.scrollLeft,
107 top = offsets[1] + container.scrollTop,
108 bottom = top + el.offsetHeight,
109 right = left + el.offsetWidth,
111 ctClientHeight = container.clientHeight,
112 ctScrollTop = parseInt(container.scrollTop, 10),
113 ctScrollLeft = parseInt(container.scrollLeft, 10),
114 ctBottom = ctScrollTop + ctClientHeight,
115 ctRight = ctScrollLeft + container.clientWidth;
117 if (el.offsetHeight > ctClientHeight || top < ctScrollTop) {
118 container.scrollTop = top;
119 } else if (bottom > ctBottom) {
120 container.scrollTop = bottom - ctClientHeight;
122 // corrects IE, other browsers will ignore
123 container.scrollTop = container.scrollTop;
125 if (hscroll !== false) {
126 if (el.offsetWidth > container.clientWidth || left < ctScrollLeft) {
127 container.scrollLeft = left;
129 else if (right > ctRight) {
130 container.scrollLeft = right - container.clientWidth;
132 container.scrollLeft = container.scrollLeft;
138 scrollChildIntoView : function(child, hscroll) {
139 Ext.fly(child, '_scrollChildIntoView').scrollIntoView(this, hscroll);
143 * Scrolls this element the specified direction. Does bounds checking to make sure the scroll is
144 * within this element's scrollable range.
145 * @param {String} direction Possible values are: "l" (or "left"), "r" (or "right"), "t" (or "top", or "up"), "b" (or "bottom", or "down").
146 * @param {Number} distance How far to scroll the element in pixels
147 * @param {Boolean/Object} animate (optional) true for the default animation or a standard Element animation config object
148 * @return {Boolean} Returns true if a scroll was triggered or false if the element
149 * was scrolled as far as it could go.
151 scroll : function(direction, distance, animate) {
152 if (!this.isScrollable()) {
156 l = el.scrollLeft, t = el.scrollTop,
157 w = el.scrollWidth, h = el.scrollHeight,
158 cw = el.clientWidth, ch = el.clientHeight,
161 l: Math.min(l + distance, w-cw),
162 r: v = Math.max(l - distance, 0),
163 t: Math.max(t - distance, 0),
164 b: Math.min(t + distance, h-ch)
169 direction = direction.substr(0, 1);
170 if ((v = hash[direction]) > -1) {
172 this.scrollTo(direction == 'l' || direction == 'r' ? 'left' : 'top', v, this.anim(animate));