DHTML - runtimeStyle

 

runtimeStyle Object

---

Represents the cascaded format and style of the object that overrides the format and style specified in global style sheets, inline styles, and HTML attributes.

Remarks

The runtimeStyle object sets and retrieves the format and style of an object, and overrides existing formats and styles in the process. Other than having precedence over the style object and not persisting, the runtimeStyle object is equivalent to the style object.

Property	Description
onOffBehavior	Retrieves an object indicating whether the specified Microsoft® DirectAnimation® behavior is running.

Filter Property	Description
Alpha	Adjusts the opacity of the content of the object.
BlendTrans	Reveals new content of the object by fading the original content.
Chroma	Displays a specific color of the content of the object as transparent.
DropShadow	Creates a solid silhouette of the content of the object, offset in the specified direction. This creates the illusion that the content is floating and casting a shadow.
FlipH	Displays the content of the object flipped across the horizontal axis.
FlipV	Displays the content of the object flipped across the vertical axis.
Glow	Adds radiance around the outside edges of the content of the object so that it appears to glow.
Gray	Displays the content of the object in grayscale.
Invert	Reverses the hue, saturation, and brightness values of the content of the object.
Light	Creates the effect of a light shining on the content of the object.
MaskFilter	Displays transparent pixels of the object content as a color mask, and makes the nontransparent pixels transparent.
MotionBlur	Causes the content of the object to appear to be in motion.
Redirect	Not currently supported.
RevealTrans	Reveals new content of the object using one of 24 predefined Transition effects.
Shadow	Creates a solid silhouette of the content of the object, offset in the specified direction. This creates the illusion of a shadow.
Wave	Performs a sine wave distortion of the content of the object along the vertical axis.
Xray	Changes the color depth of the content of the object and displays it in black and white.

Method	Description
getAttribute	Retrieves the value of the specified attribute.
getExpression	Retrieves the expression for the given property.
removeAttribute	Removes the given attribute from the object.
removeExpression	Removes the expression from the specified property.
setAttribute	Sets the value of the specified attribute.
setExpression	Sets an expression for the specified object.

Style Attribute	Style Property	Description
ACCELERATOR	accelerator	Sets or retrieves a string that indicates whether the object contains an accelerator key.
background	background	Sets or retrieves up to five separate background properties of the object.
background-attachment	backgroundAttachment	Sets or retrieves how the background image is attached to the object within the document.
background-color	backgroundColor	Sets or retrieves the color behind the content of the object.
background-image	backgroundImage	Sets or retrieves the background image of the object.
background-position	backgroundPosition	Sets or retrieves the position of the background of the object.
background-position-x	backgroundPositionX	Sets or retrieves the x-coordinate of the backgroundPosition property.
background-position-y	backgroundPositionY	Sets or retrieves the y-coordinate of the backgroundPosition property.
background-repeat	backgroundRepeat	Sets or retrieves how the backgroundImage property of the object is tiled.
behavior	behavior	Sets or retrieves the location of the DHTML Behaviors.
border	border	Sets or retrieves the properties to draw around the object.
border-bottom	borderBottom	Sets or retrieves the properties of the bottom border of the object.
border-bottom-color	borderBottomColor	Sets or retrieves the color of the bottom border of the object.
border-bottom-style	borderBottomStyle	Sets or retrieves the style of the bottom border of the object.
border-bottom-width	borderBottomWidth	Sets or retrieves the width of the bottom border of the object.
border-collapse	borderCollapse	Sets or retrieves a value that indicates whether the row and cell borders of a table are joined in a single border or detached as in standard HTML.
border-color	borderColor	Sets or retrieves the border color of the object.
border-left	borderLeft	Sets or retrieves the properties of the left border of the object.
border-left-color	borderLeftColor	Sets or retrieves the color of the left border of the object.
border-left-style	borderLeftStyle	Sets or retrieves the style of the left border of the object.
border-left-width	borderLeftWidth	Sets or retrieves the width of the left border of the object.
border-right	borderRight	Sets or retrieves the properties of the right border of the object.
border-right-color	borderRightColor	Sets or retrieves the color of the right border of the object.
border-right-style	borderRightStyle	Sets or retrieves the style of the right border of the object.
border-right-width	borderRightWidth	Sets or retrieves the width of the right border of the object.
border-style	borderStyle	Sets or retrieves the style of the left, right, top, and bottom borders of the object.
border-top	borderTop	Sets or retrieves the properties of the top border of the object.
border-top-color	borderTopColor	Sets or retrieves the color of the top border of the object.
border-top-style	borderTopStyle	Sets or retrieves the style of the top border of the object.
border-top-width	borderTopWidth	Sets or retrieves the width of the top border of the object.
border-width	borderWidth	Sets or retrieves the width of the left, right, top, and bottom borders of the object.
bottom	bottom	Sets or retrieves the bottom position of the object in relation to the bottom of the next positioned object in the document hierarchy.
clear	clear	Sets or retrieves whether the object allows floating objects on its left side, right side, or both, so that the next text displays past the floating objects.
clip	clip	Sets or retrieves which part of a positioned object is visible.
color	color	Sets or retrieves the color of the text of the object.
	cssText	Sets or retrieves the persisted representation of the style rule.
cursor	cursor	Sets or retrieves the type of cursor to display as the mouse pointer moves over the object.
direction	direction	Sets or retrieves the reading order of the object.
font	font	Sets or retrieves up to six separate font properties of the object.
font-family	fontFamily	Sets or retrieves the name of the font used for text in the object.
font-size	fontSize	Sets or retrieves the size of the font used for text in the object.
font-style	fontStyle	Sets or retrieves the font style of the object as italic, normal, or oblique.
font-variant	fontVariant	Sets or retrieves whether the text of the object is in small capital letters.
font-weight	fontWeight	Sets or retrieves the weight of the font of the object.
height	height	Sets or retrieves the height of the object.
ime-mode	imeMode	Sets or retrieves the state of an Input Method Editor (IME).
layout-flow	layoutFlow	Sets or retrieves the direction and flow of the content in the object.
layout-grid	layoutGrid	Sets or retrieves the composite document grid properties that specify the layout of text characters.
layout-grid-char	layoutGridChar	Sets or retrieves the size of the character grid used for rendering the text content of an element.
layout-grid-line	layoutGridLine	Sets or retrieves the gridline value used for rendering the text content of an element.
layout-grid-mode	layoutGridMode	Sets or retrieves whether the text layout grid uses two dimensions.
layout-grid-type	layoutGridType	Sets or retrieves the type of grid used for rendering the text content of an element.
left	left	Sets or retrieves the position of the object relative to the left edge of the next positioned object in the document hierarchy.
letter-spacing	letterSpacing	Sets or retrieves the amount of additional space between letters in the object.
line-break	lineBreak	Sets or retrieves line-breaking rules for Japanese text.
line-height	lineHeight	Sets or retrieves the distance between lines in the object.
list-style	listStyle	Sets or retrieves up to three separate listStyle properties of the object.
list-style-image	listStyleImage	Sets or retrieves which image to use as a list-item marker for the object.
list-style-position	listStylePosition	Sets or retrieves how the list-item marker is drawn relative to the content of the object.
list-style-type	listStyleType	Sets or retrieves the predefined type of the line-item marker for the object.
margin	margin	Sets or retrieves the width of the top, right, bottom, and left margins of the object.
margin-bottom	marginBottom	Sets or retrieves the height of the bottom margin of the object.
margin-left	marginLeft	Sets or retrieves the width of the left margin of the object.
margin-right	marginRight	Sets or retrieves the width of the right margin of the object.
margin-top	marginTop	Sets or retrieves the height of the top margin of the object.
min-height	minHeight	Sets or retrieves the minimum height for an element.
overflow	overflow	Sets or retrieves a value indicating how to manage the content of the object when the content exceeds the height or width of the object.
overflow-x	overflowX	Sets or retrieves how to manage the content of the object when the content exceeds the width of the object.
overflow-y	overflowY	Sets or retrieves how to manage the content of the object when the content exceeds the height of the object.
padding	padding	Sets or retrieves the amount of space to insert between the object and its margin or, if there is a border, between the object and its border.
padding-bottom	paddingBottom	Sets or retrieves the amount of space to insert between the bottom border of the object and the content.
padding-left	paddingLeft	Sets or retrieves the amount of space to insert between the left border of the object and the content.
padding-right	paddingRight	Sets or retrieves the amount of space to insert between the right border of the object and the content.
padding-top	paddingTop	Sets or retrieves the amount of space to insert between the top border of the object and the content.
page-break-after	pageBreakAfter	Sets or retrieves a value indicating whether a page break occurs after the object.
page-break-before	pageBreakBefore	Sets or retrieves a string indicating whether a page break occurs before the object.
	pixelBottom	Sets or retrieves the bottom position of the object.
	pixelHeight	Sets or retrieves the height of the object.
	pixelLeft	Sets or retrieves the left position of the object.
	pixelRight	Sets or retrieves the right position of the object.
	pixelTop	Sets or retrieves the top position of the object.
	pixelWidth	Sets or retrieves the width of the object.
	posBottom	Sets or retrieves the bottom position of the object in the units specified by the bottom attribute.
	posHeight	Sets or retrieves the height of the object in the units specified by the height attribute.
position	position	Sets or retrieves the type of positioning used for the object.
	posLeft	Sets or retrieves the left position of the object in the units specified by the left attribute.
	posRight	Sets or retrieves the right position of the object in the units specified by the right attribute.
	posTop	Sets or retrieves the top position of the object in the units specified by the top attribute.
	posWidth	Sets or retrieves the width of the object in the units specified by the width attribute.
right	right	Sets or retrieves the position of the object relative to the right edge of the next positioned object in the document hierarchy.
ruby-align	rubyAlign	Sets or retrieves the position of the ruby text specified by the rt object.
ruby-overhang	rubyOverhang	Sets or retrieves the position of the ruby text specified by the rt object.
ruby-position	rubyPosition	Sets or retrieves the position of the ruby text specified by the rt object.
scrollbar-3dlight-color	scrollbar3dLightColor	Sets or retrieves the color of the top and left edges of the scroll box and scroll arrows of a scroll bar.
scrollbar-arrow-color	scrollbarArrowColor	Sets or retrieves the color of the arrow elements of a scroll arrow.
scrollbar-base-color	scrollbarBaseColor	Sets or retrieves the color of the main elements of a scroll bar, which include the scroll box, track, and scroll arrows.
scrollbar-darkshadow-color	scrollbarDarkShadowColor	Sets or retrieves the color of the gutter of a scroll bar.
scrollbar-face-color	scrollbarFaceColor	Sets or retrieves the color of the scroll box and scroll arrows of a scroll bar.
scrollbar-highlight-color	scrollbarHighlightColor	Sets or retrieves the color of the top and left edges of the scroll box and scroll arrows of a scroll bar.
scrollbar-shadow-color	scrollbarShadowColor	Sets or retrieves the color of the bottom and right edges of the scroll box and scroll arrows of a scroll bar.
scrollbar-track-color	scrollbarTrackColor	Sets or retrieves the color of the track element of a scroll bar.
float	styleFloat	Sets or retrieves on which side of the object the text will flow.
table-layout	tableLayout	Sets or retrieves a string that indicates whether the table layout is fixed.
text-align	textAlign	Sets or retrieves whether the text in the object is left-aligned, right-aligned, centered, or justified.
text-align-last	textAlignLast	Sets or retrieves how to align the last line or only line of text in the object.
text-autospace	textAutospace	Sets or retrieves the autospacing and narrow space width adjustment of text.
text-decoration	textDecoration	Sets or retrieves whether the text in the object has blink, line-through, overline, or underline decorations.
	textDecorationBlink	Sets or retrieves a Boolean value that indicates whether the object's textDecoration property has a value of "blink."
	textDecorationLineThrough	Sets or retrieves a Boolean value indicating whether the text in the object has a line drawn through it.
	textDecorationNone	Sets or retrieves the Boolean value indicating whether the textDecoration property for the object has been set to none.
	textDecorationOverline	Sets or retrieves a Boolean value indicating whether the text in the object has a line drawn over it.
	textDecorationUnderline	Sets or retrieves whether the text in the object is underlined.
text-indent	textIndent	Sets or retrieves the indentation of the first line of text in the object.
text-justify	textJustify	Sets or retrieves the type of alignment used to justify text in the object.
text-kashida-space	textKashidaSpace	Sets or retrieves the ratio of kashida expansion to white space expansion when justifying lines of text in the object.
text-overflow	textOverflow	Sets or retrieves a value that indicates whether to render ellipses(...) to indicate text overflow.
text-transform	textTransform	Sets or retrieves the rendering of the text in the object.
text-underline-position	textUnderlinePosition	Sets or retrieves the position of the underline decoration that is set through the textDecoration property of the object.
top	top	Sets or retrieves the position of the object relative to the top of the next positioned object in the document hierarchy.
unicode-bidi	unicodeBidi	Sets or retrieves the level of embedding with respect to the bidirectional algorithm.
vertical-align	verticalAlign	Sets or retrieves the vertical alignment of the object.
visibility	visibility	Sets or retrieves whether the content of the object is displayed.
width	width	Sets or retrieves the width of the object.
word-break	wordBreak	Sets or retrieves line-breaking behavior within words, particularly where multiple languages appear in the object.
word-spacing	wordSpacing	Sets or retrieves the amount of additional space between words in the object.
word-wrap	wordWrap	Sets or retrieves whether to break words when the content exceeds the boundaries of its container.
writing-mode	writingMode	Sets or retrieves the direction and flow of the content in the object.
z-index	zIndex	Sets or retrieves the stacking order of positioned objects.
zoom	zoom	Sets or retrieves the magnification scale of the object.

Example

This example sets a value on the runtimeStyle object to affect the currentStyle object, but not the style object.

<SCRIPT>
function fnChangeValue(sValue){
   if(oDIV.runtimeStyle.backgroundColor == oDIV.style.backgroundColor){
      sValue="";
   }
   oDIV.runtimeStyle.backgroundColor = sValue;
   alert(oDIV.style.backgroundColor +
      "\n" + oDIV.currentStyle.backgroundColor +
      "\n" + oDIV.runtimeStyle.backgroundColor);
}
</SCRIPT>

<DIV ID = "oDIV">
This is a demonstration DIV.
</DIV>

<INPUT TYPE = "button" VALUE = "Change Color" onclick="fnChangeValue('blue')">

This feature requires Microsoft® Internet Explorer 5 or later. Click the icon below to install the latest version. Then reload this page to view the sample.

Standards Information

There is no public standard that applies to this object.

Applies To

A, ACRONYM, ADDRESS, APPLET, B, BIG, BLOCKQUOTE, BODY, BR, BUTTON, CAPTION, CENTER, CITE, CODE, COL, COLGROUP, CUSTOM, DD, DEL, DFN, DIR, DIV, DL, DT, EM, EMBED, FIELDSET, FONT, FORM, FRAME, FRAMESET, Hn, HR, HTML, I, IFRAME, IMG, INPUT type=button, INPUT type=checkbox, INPUT type=file, INPUT type=hidden, INPUT type=image, INPUT type=password, INPUT type=radio, INPUT type=reset, INPUT type=submit, INPUT type=text, INS, KBD, LABEL, LEGEND, LI, LISTING, MARQUEE, MENU, NOBR, OBJECT, OL, OPTION, P, PLAINTEXT, PRE, Q, S, SAMP, SELECT, SMALL, SPAN, STRIKE, STRONG, SUB, SUP, TABLE, TBODY, TD, TEXTAREA, TFOOT, TH, THEAD, TR, TT, U, UL, VAR, XMP

See Also

currentStyle