goog.style
Functions
clearTransparentBackgroundImage( el ) → void
void
Clears the background image of an element in a browser independent manner.
Parameters |
|
---|
getBackgroundColor( element ) → string
string
Retrieves the computed background color string for a given element. The string returned is suitable for assigning to another element's background-color, but is not guaranteed to be in any particular string format. Accessing the color in a numeric form may not be possible in all browsers or with all input.
If the background color for the element is defined as a hexadecimal value, the resulting string can be parsed by goog.color.parse in all supported browsers.
Whether named colors like "red" or "lightblue" get translated into a format which can be parsed is browser dependent. Calling this function on transparent elements will return "transparent" in most browsers or "rgba(0, 0, 0, 0)" in WebKit.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getBorderBox( element ) → goog.math.Box
goog.math.Box
Gets the computed border widths (on all sides) in pixels
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getBorderBoxSize( element ) → goog.math.Size
goog.math.Size
Gets the border box size for an element.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getBounds( element ) → goog.math.Rect
goog.math.Rect
Returns a bounding rectangle for a given element in page space.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getCascadedStyle( element, style ) → string
string
getClientLeftTop( el ) → goog.math.Coordinate
goog.math.Coordinate
Returns clientLeft (width of the left border and, if the directionality is right to left, the vertical scrollbar) and clientTop as a coordinate object.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getClientPosition( el ) → goog.math.Coordinate
goog.math.Coordinate
Returns the position of the event or the element's border box relative to the client viewport. If an event is passed, and if this event is a "touch" event, then the position of the first changedTouches will be returned.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getClientViewportElement( opt_node ) → (Element|null)
(Element|null)
Returns the viewport element for a particular document
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getComputedBoxSizing( element ) → (string|null)
(string|null)
Retrieves the computed value of the box-sizing CSS attribute. Browser support: http://caniuse.com/css3-boxsizing.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getComputedCursor( element ) → string
string
Retrieves the computed value of the cursor CSS attribute.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getComputedOverflowX( element ) → string
string
Retrieves the computed value of the overflow-x CSS attribute.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getComputedOverflowY( element ) → string
string
Retrieves the computed value of the overflow-y CSS attribute.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getComputedPosition( element ) → string
string
Retrieves the computed value of the position CSS attribute.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getComputedStyle( element, property ) → string
string
Retrieves a computed style value of a node. It returns empty string if the value cannot be computed (which will be the case in Internet Explorer) or "none" if the property requested is an SVG one and it has not been explicitly set (firefox and webkit).
Parameters |
| ||||||||
---|---|---|---|---|---|---|---|---|---|
Returns |
|
getComputedTextAlign( element ) → string
string
Retrieves the computed value of the text-align CSS attribute.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getComputedTransform( element ) → string
string
Retrieves the computed value of the CSS transform attribute.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getContainerOffsetToScrollInto( element, opt_container, opt_center ) → goog.math.Coordinate
goog.math.Coordinate
Calculate the scroll position of container
with the minimum amount so
that the content and the borders of the given element
become visible.
If the element is bigger than the container, its top left corner will be
aligned as close to the container's top left corner as possible.
Parameters |
| ||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|
Returns |
|
getContentBoxSize( element ) → goog.math.Size
goog.math.Size
Gets the content box size for an element. This is potentially expensive in all browsers.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getCssTranslation( element ) → goog.math.Coordinate
goog.math.Coordinate
Returns the x,y translation component of any CSS transforms applied to the element, in pixels.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getFloat( el ) → string
string
Gets value of explicitly-set float CSS property on an element.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getFontFamily( el ) → string
string
Returns the font face applied to a given node. Opera and IE should return the font actually displayed. Firefox returns the author's most-preferred font (whether the browser is capable of displaying it or not.)
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getFontSize( el ) → number
number
Returns the font size, in pixels, of text in an element.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getFramedPageOffset( el, relativeWin ) → goog.math.Coordinate
goog.math.Coordinate
Returns a Coordinate object relative to the top-left of an HTML document in an ancestor frame of this element. Used for measuring the position of an element inside a frame relative to a containing frame.
Parameters |
| ||||||||
---|---|---|---|---|---|---|---|---|---|
Returns |
|
getLengthUnits( value ) → (string|null)
(string|null)
getMarginBox( element ) → goog.math.Box
goog.math.Box
Gets the computed margins (on all sides) in pixels.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getOffsetParent( element ) → (Element|null)
(Element|null)
Returns the first parent that could affect the position of a given element.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
Gets the opacity of a node (x-browser). This gets the inline style opacity of the node, and does not take into account the cascaded or the computed style for this node.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getPaddingBox( element ) → goog.math.Box
goog.math.Box
Gets the computed paddings (on all sides) in pixels.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getPageOffset( el ) → goog.math.Coordinate
goog.math.Coordinate
Returns a Coordinate object relative to the top-left of the HTML document. Implemented as a single function to save having to do two recursive loops in opera and safari just to get both coordinates. If you just want one value do use goog.style.getPageOffsetLeft() and goog.style.getPageOffsetTop(), but note if you call both those methods the tree will be analysed twice.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getPageOffsetLeft( el ) → number
number
Returns the left coordinate of an element relative to the HTML document
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getPageOffsetTop( el ) → number
number
Returns the top coordinate of an element relative to the HTML document
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getPosition( element ) → goog.math.Coordinate
goog.math.Coordinate
Gets the offsetLeft and offsetTop properties of an element and returns them in a Coordinate object
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getRelativePosition( a, b ) → goog.math.Coordinate
goog.math.Coordinate
Returns the position of an element relative to another element in the document. A relative to B
Parameters |
| ||||||||
---|---|---|---|---|---|---|---|---|---|
Returns |
|
getScrollbarWidth( opt_className ) → number
number
Returns the scroll bar width (represents the width of both horizontal and vertical scroll).
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getSize( element ) → goog.math.Size
goog.math.Size
Gets the height and width of an element, even if its display is none.
Specifically, this returns the height and width of the border box, irrespective of the box model in effect.
Note that this function does not take CSS transforms into account. Please see
goog.style.getTransformedSize
.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getStyle( element, property ) → string
string
Retrieves an explicitly-set style value of a node. This returns '' if there isn't a style attribute on the element or if this style property has not been explicitly set in script.
Parameters |
| ||||||||
---|---|---|---|---|---|---|---|---|---|
Returns |
|
getTransformedSize( element ) → (goog.math.Size|null)
(goog.math.Size|null)
Gets the height and width of an element, post transform, even if its display is none.
This is like goog.style.getSize
, except:
- Takes webkitTransforms such as rotate and scale into account.
- Will return null if `element` doesn't respond to `getBoundingClientRect`.
- Currently doesn't make sense on non-WebKit browsers which don't support webkitTransforms.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getViewportPageOffset( doc ) → goog.math.Coordinate
goog.math.Coordinate
Calculates the viewport coordinates relative to the page/document containing the node. The viewport may be the browser viewport for non-iframe document, or the iframe container for iframe'd document.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
getVisibleRectForElement( element ) → (goog.math.Box|null)
(goog.math.Box|null)
Calculates and returns the visible rectangle for a given element. Returns a box describing the visible portion of the nearest scrollable offset ancestor. Coordinates are given relative to the document.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
installSafeStyleSheet( safeStyleSheet, opt_node ) → (HTMLStyleElement|StyleSheet)
(HTMLStyleElement|StyleSheet)
Installs the style sheet into the window that contains opt_node. If opt_node is null, the main window is used.
Parameters |
| ||||||||
---|---|---|---|---|---|---|---|---|---|
Returns |
|
isElementShown( el ) → boolean
boolean
Test whether the given element has been shown or hidden via a call to
#setElementShown
.
Note this is strictly a companion method for a call
to #setElementShown
and the same caveats apply; in particular, this
method does not guarantee that the return value will be consistent with
whether or not the element is actually visible.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
| ||||
See Also |
isRightToLeft( el ) → boolean
boolean
Returns true if the element is using right to left (rtl) direction.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
isUnselectable( el ) → boolean
boolean
Returns true if the element is set to be unselectable, false otherwise. Note that on some platforms (e.g. Mozilla), even if an element isn't set to be unselectable, it will behave as such if any of its ancestors is unselectable.
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
parseStyleAttribute( value ) → Object
Object
scrollIntoContainerView( element, opt_container, opt_center ) → void
void
Changes the scroll position of container
with the minimum amount so
that the content and the borders of the given element
become visible.
If the element is bigger than the container, its top left corner will be
aligned as close to the container's top left corner as possible.
Parameters |
|
---|
setBorderBoxSize( element, size ) → void
void
Sets the border box size of an element. This is potentially expensive in IE if the document is CSS1Compat mode
Parameters |
|
---|
setContentBoxSize( element, size ) → void
void
Sets the content box size of an element. This is potentially expensive in IE if the document is BackCompat mode.
Parameters |
|
---|
setElementShown( el, isShown ) → void
void
Shows or hides an element from the page. Hiding the element is done by setting the display property to "none", removing the element from the rendering hierarchy so it takes up no space. To show the element, the default inherited display property is restored (defined either in stylesheets or by the browser's default style rules).
Caveat 1: if the inherited display property for the element is set to "none" by the stylesheets, that is the property that will be restored by a call to setElementShown(), effectively toggling the display between "none" and "none".
Caveat 2: if the element display style is set inline (by setting either element.style.display or a style attribute in the HTML), a call to setElementShown will clear that setting and defer to the inherited style in the stylesheet.
Parameters |
|
---|
setFloat( el, value ) → void
void
Sets CSS float property on an element.
Parameters |
|
---|
setHeight( element, height ) → void
void
setInlineBlock( el ) → void
void
Sets 'display: inline-block' for an element (cross-browser).
Parameters |
| ||||
---|---|---|---|---|---|
See Also | ../demos/inline_block_quirks.html ../demos/inline_block_standards.html |
setOpacity( el, alpha ) → void
void
setPageOffset( el, x, opt_y ) → void
void
Moves an element to the given coordinates relative to the client viewport.
Parameters |
|
---|
setPosition( el, arg1, opt_arg2 ) → void
void
Sets the top/left values of an element. If no unit is specified in the argument then it will add px. The second argument is required if the first argument is a string or number and is ignored if the first argument is a coordinate.
Parameters |
|
---|
setPreWrap( el ) → void
void
Sets 'white-space: pre-wrap' for a node (x-browser).
There are as many ways of specifying pre-wrap as there are browsers.
CSS3/IE8: white-space: pre-wrap; Mozilla: white-space: -moz-pre-wrap; Opera: white-space: -o-pre-wrap; IE6/7: white-space: pre; word-wrap: break-word;
Parameters |
|
---|
setSafeStyleSheet( element, safeStyleSheet ) → void
void
Sets the content of a style element. The style element can be any valid style element. This element will have its content completely replaced by the safeStyleSheet.
Parameters |
|
---|
setSize( element, w, opt_h ) → void
void
Sets the width/height values of an element. If an argument is numeric, or a goog.math.Size is passed, it is assumed to be pixels and will add 'px' after converting it to an integer in string form. (This just sets the CSS width and height properties so it might set content-box or border-box size depending on the box model the browser is using.)
Parameters |
|
---|
setStyle( element, style, opt_value ) → void
void
Sets a style value on an element.
This function is not indended to patch issues in the browser's style handling, but to allow easy programmatic access to setting dash-separated style properties. An example is setting a batch of properties from a data object without overwriting old styles. When possible, use native APIs: elem.style.propertyKey = 'value' or (if obliterating old styles is fine) elem.style.cssText = 'property1: value1; property2: value2'.
Parameters |
|
---|
setTransparentBackgroundImage( el, src ) → void
void
Sets the background of an element to a transparent image in a browser- independent manner.
This function does not support repeating backgrounds or alternate background positions to match the behavior of Internet Explorer. It also does not support sizingMethods other than crop since they cannot be replicated in browsers other than Internet Explorer.
Parameters |
|
---|
setUnselectable( el, unselectable, opt_noRecurse ) → void
void
Makes the element and its descendants selectable or unselectable. Note that on some platforms (e.g. Mozilla), even if an element isn't set to be unselectable, it will behave as such if any of its ancestors is unselectable.
Parameters |
|
---|
setWidth( element, width ) → void
void
showElement( el, display ) → void
void
Shows or hides an element from the page. Hiding the element is done by setting the display property to "none", removing the element from the rendering hierarchy so it takes up no space. To show the element, the default inherited display property is restored (defined either in stylesheets or by the browser's default style rules.)
Caveat 1: if the inherited display property for the element is set to "none" by the stylesheets, that is the property that will be restored by a call to showElement(), effectively toggling the display between "none" and "none".
Caveat 2: if the element display style is set inline (by setting either element.style.display or a style attribute in the HTML), a call to showElement will clear that setting and defer to the inherited style in the stylesheet.
warning Deprecated | Use goog.style.setElementShown instead. |
---|
Parameters |
|
---|
toCamelCase( selector ) → string
string
Converts a CSS selector in the form style-property to styleProperty.
warning Deprecated | Use goog.string.toCamelCase instead. |
---|
Parameters |
| ||||
---|---|---|---|---|---|
Returns |
|
toSelectorCase( selector ) → string
string
toStyleAttribute( obj ) → string
string
translateRectForAnotherFrame( rect, origBase, newBase ) → void
void
Translates the specified rect relative to origBase page, for newBase page. If origBase and newBase are the same, this function does nothing.
Parameters |
|
---|
uninstallStyles( styleSheet ) → void
void
Removes the styles added by #installSafeStyleSheet
.
Parameters |
|
---|