X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/25ef3491bd9ae007ff1fc2b0d7943e6eaaccf775..0494b8d9b9bb03ab6c22b34dae81261e3cd7e3e6:/docs/source/Element.style.html diff --git a/docs/source/Element.style.html b/docs/source/Element.style.html index cc55a136..23dc3b82 100644 --- a/docs/source/Element.style.html +++ b/docs/source/Element.style.html @@ -1,29 +1,31 @@ + The source code
/*!
- * Ext JS Library 3.0.3
- * Copyright(c) 2006-2009 Ext JS, LLC
- * licensing@extjs.com
- * http://www.extjs.com/license
+ * Ext JS Library 3.3.1
+ * Copyright(c) 2006-2010 Sencha Inc.
+ * licensing@sencha.com
+ * http://www.sencha.com/license
  */
 /**
  * @class Ext.Element
  */
-Ext.Element.addMethods(function(){  
+Ext.Element.addMethods(function(){
     // local style camelizing for speed
-    var propCache = {},
+    var supports = Ext.supports,
+        propCache = {},
         camelRe = /(-[a-z])/gi,
-        classReCache = {},
         view = document.defaultView,
-        propFloat = Ext.isIE ? 'styleFloat' : 'cssFloat',
         opacityRe = /alpha\(opacity=(.*)\)/i,
         trimRe = /^\s+|\s+$/g,
-        EL = Ext.Element,   
+        EL = Ext.Element,
+        spacesRe = /\s+/,
+        wordsRe = /\w/g,
         PADDING = "padding",
         MARGIN = "margin",
         BORDER = "border",
@@ -31,7 +33,7 @@ Ext.Element.addMethods(function(){
         RIGHT = "-right",
         TOP = "-top",
         BOTTOM = "-bottom",
-        WIDTH = "-width",    
+        WIDTH = "-width",
         MATH = Math,
         HIDDEN = 'hidden',
         ISCLIPPED = 'isClipped',
@@ -39,88 +41,127 @@ Ext.Element.addMethods(function(){
         OVERFLOWX = 'overflow-x',
         OVERFLOWY = 'overflow-y',
         ORIGINALCLIP = 'originalClip',
-        // special markup used throughout Ext when box wrapping elements    
+        // special markup used throughout Ext when box wrapping elements
         borders = {l: BORDER + LEFT + WIDTH, r: BORDER + RIGHT + WIDTH, t: BORDER + TOP + WIDTH, b: BORDER + BOTTOM + WIDTH},
         paddings = {l: PADDING + LEFT, r: PADDING + RIGHT, t: PADDING + TOP, b: PADDING + BOTTOM},
         margins = {l: MARGIN + LEFT, r: MARGIN + RIGHT, t: MARGIN + TOP, b: MARGIN + BOTTOM},
         data = Ext.Element.data;
-        
-    
-    // private  
+
+
+    // private
     function camelFn(m, a) {
         return a.charAt(1).toUpperCase();
     }
-    
+
     function chkCache(prop) {
-        return propCache[prop] || (propCache[prop] = prop == 'float' ? propFloat : prop.replace(camelRe, camelFn));
+        return propCache[prop] || (propCache[prop] = prop == 'float' ? (supports.cssFloat ? 'cssFloat' : 'styleFloat') : prop.replace(camelRe, camelFn));
     }
-            
+
     return {
-        // private  ==> used by Fx  
+        // private  ==> used by Fx
         adjustWidth : function(width) {
             var me = this;
-            var isNum = Ext.isNumber(width);
+            var isNum = (typeof width == "number");
             if(isNum && me.autoBoxAdjust && !me.isBorderBox()){
                width -= (me.getBorderWidth("lr") + me.getPadding("lr"));
             }
             return (isNum && width < 0) ? 0 : width;
         },
-        
-        // private   ==> used by Fx 
+
+        // private   ==> used by Fx
         adjustHeight : function(height) {
             var me = this;
-            var isNum = Ext.isNumber(height);
+            var isNum = (typeof height == "number");
             if(isNum && me.autoBoxAdjust && !me.isBorderBox()){
-               height -= (me.getBorderWidth("tb") + me.getPadding("tb"));               
+               height -= (me.getBorderWidth("tb") + me.getPadding("tb"));
             }
             return (isNum && height < 0) ? 0 : height;
         },
-    
-    
+
+
         
/** * Adds one or more CSS classes to the element. Duplicate classes are automatically filtered out. * @param {String/Array} className The CSS class to add, or an array of classes * @return {Ext.Element} this */ addClass : function(className){ - var me = this; - Ext.each(className, function(v) { - me.dom.className += (!me.hasClass(v) && v ? " " + v : ""); - }); - return me; - }, - -
/** - * Adds one or more CSS classes to this element and removes the same class(es) from all siblings. - * @param {String/Array} className The CSS class to add, or an array of classes - * @return {Ext.Element} this - */ - radioClass : function(className){ - Ext.each(this.dom.parentNode.childNodes, function(v) { - if(v.nodeType == 1) { - Ext.fly(v, '_internal').removeClass(className); + var me = this, + i, + len, + v, + cls = []; + // Separate case is for speed + if (!Ext.isArray(className)) { + if (typeof className == 'string' && !this.hasClass(className)) { + me.dom.className += " " + className; } - }); - return this.addClass(className); + } + else { + for (i = 0, len = className.length; i < len; i++) { + v = className[i]; + if (typeof v == 'string' && (' ' + me.dom.className + ' ').indexOf(' ' + v + ' ') == -1) { + cls.push(v); + } + } + if (cls.length) { + me.dom.className += " " + cls.join(" "); + } + } + return me; }, - +
/** * Removes one or more CSS classes from the element. * @param {String/Array} className The CSS class to remove, or an array of classes * @return {Ext.Element} this */ removeClass : function(className){ - var me = this; + var me = this, + i, + idx, + len, + cls, + elClasses; + if (!Ext.isArray(className)){ + className = [className]; + } if (me.dom && me.dom.className) { - Ext.each(className, function(v) { - me.dom.className = me.dom.className.replace( - classReCache[v] = classReCache[v] || new RegExp('(?:^|\\s+)' + v + '(?:\\s+|$)', "g"), - " "); - }); + elClasses = me.dom.className.replace(trimRe, '').split(spacesRe); + for (i = 0, len = className.length; i < len; i++) { + cls = className[i]; + if (typeof cls == 'string') { + cls = cls.replace(trimRe, ''); + idx = elClasses.indexOf(cls); + if (idx != -1) { + elClasses.splice(idx, 1); + } + } + } + me.dom.className = elClasses.join(" "); } return me; }, - + +
/** + * Adds one or more CSS classes to this element and removes the same class(es) from all siblings. + * @param {String/Array} className The CSS class to add, or an array of classes + * @return {Ext.Element} this + */ + radioClass : function(className){ + var cn = this.dom.parentNode.childNodes, + v, + i, + len; + className = Ext.isArray(className) ? className : [className]; + for (i = 0, len = cn.length; i < len; i++) { + v = cn[i]; + if (v && v.nodeType == 1) { + Ext.fly(v, '_internal').removeClass(className); + } + }; + return this.addClass(className); + }, +
/** * Toggles the specified CSS class on this element (removes it if it already exists, otherwise adds it). * @param {String} className The CSS class to toggle @@ -129,7 +170,7 @@ Ext.Element.addMethods(function(){ toggleClass : function(className){ return this.hasClass(className) ? this.removeClass(className) : this.addClass(className); }, - +
/** * Checks if the specified CSS class exists on this element's DOM node. * @param {String} className The CSS class to check for @@ -138,7 +179,7 @@ Ext.Element.addMethods(function(){ hasClass : function(className){ return className && (' '+this.dom.className+' ').indexOf(' '+className+' ') != -1; }, - +
/** * Replaces a CSS class on the element with another. If the old name does not exist, the new name will simply be added. * @param {String} oldClassName The CSS class to replace @@ -148,42 +189,54 @@ Ext.Element.addMethods(function(){ replaceClass : function(oldClassName, newClassName){ return this.removeClass(oldClassName).addClass(newClassName); }, - + isStyle : function(style, val) { - return this.getStyle(style) == val; + return this.getStyle(style) == val; }, - +
/** * Normalizes currentStyle and computedStyle. * @param {String} property The style property whose value is returned. * @return {String} The current value of the style property for this element. */ - getStyle : function(){ + getStyle : function(){ return view && view.getComputedStyle ? function(prop){ var el = this.dom, - v, + v, cs, - out; - if(el == document) return null; + out, + display; + + if(el == document){ + return null; + } prop = chkCache(prop); - out = (v = el.style[prop]) ? v : + out = (v = el.style[prop]) ? v : (cs = view.getComputedStyle(el, "")) ? cs[prop] : null; + + // Ignore cases when the margin is correctly reported as 0, the bug only shows + // numbers larger. + if(prop == 'marginRight' && out != '0px' && !supports.correctRightMargin){ + display = el.style.display; + el.style.display = 'inline-block'; + out = view.getComputedStyle(el, '').marginRight; + el.style.display = display; + } - // Webkit returns rgb values for transparent. - if(Ext.isWebKit && out == 'rgba(0, 0, 0, 0)'){ + if(prop == 'backgroundColor' && out == 'rgba(0, 0, 0, 0)' && !supports.correctTransparentColor){ out = 'transparent'; } return out; } : - function(prop){ - var el = this.dom, - m, - cs; - - if(el == document) return null; + function(prop){ + var el = this.dom, + m, + cs; + + if(el == document) return null; if (prop == 'opacity') { - if (el.style.filter.match) { + if (el.style.filter.match) { if(m = el.style.filter.match(opacityRe)){ var fv = parseFloat(m[1]); if(!isNaN(fv)){ @@ -193,7 +246,7 @@ Ext.Element.addMethods(function(){ } return 1; } - prop = chkCache(prop); + prop = chkCache(prop); return el.style[prop] || ((cs = el.currentStyle) ? cs[prop] : null); }; }(), @@ -208,16 +261,16 @@ Ext.Element.addMethods(function(){ */ getColor : function(attr, defaultValue, prefix){ var v = this.getStyle(attr), - color = Ext.isDefined(prefix) ? prefix : '#', + color = (typeof prefix != 'undefined') ? prefix : '#', h; - - if(!v || /transparent|inherit/.test(v)){ + + if(!v || (/transparent|inherit/.test(v))) { return defaultValue; } if(/^r/.test(v)){ Ext.each(v.slice(4, v.length -1).split(','), function(s){ h = parseInt(s, 10); - color += (h < 16 ? '0' : '') + h.toString(16); + color += (h < 16 ? '0' : '') + h.toString(16); }); }else{ v = v.replace('#', ''); @@ -225,7 +278,7 @@ Ext.Element.addMethods(function(){ } return(color.length > 5 ? color.toLowerCase() : defaultValue); }, - +
/** * Wrapper for setting style properties, also takes single object parameter of multiple styles. * @param {String/Object} property The style property to be set, or an object of multiple styles. @@ -233,23 +286,22 @@ Ext.Element.addMethods(function(){ * @return {Ext.Element} this */ setStyle : function(prop, value){ - var tmp, - style, - camel; - if (!Ext.isObject(prop)) { + var tmp, style; + + if (typeof prop != 'object') { tmp = {}; - tmp[prop] = value; + tmp[prop] = value; prop = tmp; } for (style in prop) { - value = prop[style]; - style == 'opacity' ? - this.setOpacity(value) : + value = prop[style]; + style == 'opacity' ? + this.setOpacity(value) : this.dom.style[chkCache(style)] = value; } return this; }, - +
/** * Set the opacity of the element * @param {Float} opacity The new opacity. 0 = transparent, .5 = 50% visibile, 1 = fully visible, etc @@ -260,10 +312,10 @@ Ext.Element.addMethods(function(){ setOpacity : function(opacity, animate){ var me = this, s = me.dom.style; - - if(!animate || !me.anim){ + + if(!animate || !me.anim){ if(Ext.isIE){ - var opac = opacity < 1 ? 'alpha(opacity=' + opacity * 100 + ')' : '', + var opac = opacity < 1 ? 'alpha(opacity=' + opacity * 100 + ')' : '', val = s.filter.replace(opacityRe, '').replace(trimRe, ''); s.zoom = 1; @@ -276,7 +328,7 @@ Ext.Element.addMethods(function(){ } return me; }, - +
/** * Clears any opacity settings from this element. Required in some cases for IE. * @return {Ext.Element} this @@ -292,7 +344,7 @@ Ext.Element.addMethods(function(){ } return this; }, - +
/** * Returns the offset height of the element * @param {Boolean} contentHeight (optional) true to get the height minus borders and padding @@ -303,11 +355,11 @@ Ext.Element.addMethods(function(){ dom = me.dom, hidden = Ext.isIE && me.isStyle('display', 'none'), h = MATH.max(dom.offsetHeight, hidden ? 0 : dom.clientHeight) || 0; - + h = !contentHeight ? h : h - me.getBorderWidth("tb") - me.getPadding("tb"); return h < 0 ? 0 : h; }, - +
/** * Returns the offset width of the element * @param {Boolean} contentWidth (optional) true to get the width minus borders and padding @@ -321,7 +373,7 @@ Ext.Element.addMethods(function(){ w = !contentWidth ? w : w - me.getBorderWidth("lr") - me.getPadding("lr"); return w < 0 ? 0 : w; }, - +
/** * Set the width of this Element. * @param {Mixed} width The new width. This may be one of:
+ \ No newline at end of file