Sets or retrieves the filter or collection of filters applied to the object.
Syntax
| HTML |
{ -ms-filter : sFilter }
|
|---|
| Scripting | [ sFilter = ] object.style.filter |
|---|
Possible Values
| sFilter | String that
specifies or receives one of the following values.- filtertype1 (parameter1, parameter2,...)
- Any filter listed in the Visual Filters and Transitions Reference.
- filtertype2 (parameter1, parameter2,...)
- Any filter listed in the Visual Filters and Transitions Reference.
|
The property is read/write.
The property has no default value. The Cascading Style Sheets (CSS) attribute is
not inherited.
DHTML expressions can be used in place of the preceding value(s). As of Internet Explorer 8, expressions are not supported in IE8 mode. For more information, see About Dynamic Properties.
Remarks
.gif)
Internet Explorer 8. The -ms-filter attribute is an extension to CSS, and can be be used as a synonym for filter in IE8 mode. When using -ms-filter, enclose the progid in single quotes (') or double quotes ("). Multiple values should be separated by commas (,), as shown in the Examples section.
An object must have layout for the filter to render. A simple way to accomplish this is to give the element a specified height and/or width. However, there are several other properties that can give an element layout. For more information on these other properties, see the hasLayout property.
The shadow filter can be applied to the img object by setting the filter on the image's parent container.
The filter mechanism is extensible and enables you to develop and add additional filters later. For more information about filters, see Introduction to Filters and Transitions.
Not available on the Macintosh platform.
Examples
The following example demonstrates how to use the -ms-filter attribute in Internet Explorer 8.
-ms-filter: 'progid:DXImageTransform.Microsoft.MotionBlur(strength=50), progid:DXImageTransform.Microsoft.BasicImage(mirror=1)';
This feature requires Microsoft Internet Explorer 8.0 or later. Click the following icon to install the latest version. Then reload this page to view the sample.
.gif)
The following example shows how to use an inline style sheet to set the filter on an image.
<img style="filter:progid:DXImageTransform.Microsoft.MotionBlur(strength=50)
progid:DXImageTransform.Microsoft.BasicImage(mirror=1)"
src="/workshop/samples/author/dhtml/graphics/cone.jpg"
height="80px" width="80px" alt="cone">
This feature requires Microsoft Internet Explorer 4.0 or later. Click the following icon to install the latest version. Then reload this page to view the sample.
The following example shows how to use inline scripting to set the filter on an image.
<script type="text/javascript">
function doFilter ()
{
filterFrom.filters.item(0).Apply();
// 12 is the dissolve filter.
filterFrom.filters.item(0).Transition=12;
imageFrom.style.visibility = "hidden";
filterTo.style.visibility = "";
filterFrom.filters.item(0).play(14);
}
</script>
</head>
<body>
<p>Click on the image to start the filter.</p>
// Call the function.
<div id="filterFrom" onclick="doFilter()"
style="position: absolute;
width: 200px;
height: 250px;
background-color: white;
filter: revealTrans()">
<img id="imageFrom"
style="position: absolute;
top: 20px;
left: 20px;"
src="sphere.jpg"
alt="sphere">
<div id="filterTo"
style="position: absolute;
width: 200px;
height: 250px;
top: 20px;
left: 20px;
background: white;
visibility: hidden;">
</div>
</div>
</body>
This feature requires Microsoft Internet Explorer 4.0 or later. Click the following icon to install the latest version. Then reload this page to view the sample.
Standards Information
There is no public standard that applies to this property.
Applies To
|
A,
ABBR,
ACRONYM,
ADDRESS,
B,
BDO,
BIG,
BLOCKQUOTE,
BODY,
BUTTON,
CAPTION,
CENTER,
CITE,
CODE,
CUSTOM,
DD,
DEL,
DFN,
DIR,
DIV,
DL,
DT,
EM,
FIELDSET,
FONT,
FORM,
FRAME,
hn,
IFRAME,
FRAMESET,
I,
INS,
IMG,
INPUT type=button,
INPUT type=checkbox,
INPUT type=file,
INPUT type=image,
INPUT type=password,
INPUT type=radio,
INPUT type=reset,
INPUT type=submit,
INPUT type=text,
KBD,
LABEL,
LEGEND,
LI,
MARQUEE,
MENU,
NOBR,
OL,
P,
PLAINTEXT,
PRE,
Q,
RT,
RUBY,
S,
SAMP,
SMALL,
SPAN,
STRIKE,
STRONG,
SUB,
SUP,
TABLE,
TEXTAREA,
TH,
TD,
TT,
U,
UL,
VAR,
XMP,
CSSCurrentStyleDeclaration Constructor,
CSSRuleStyleDeclaration Constructor,
CSSStyleDeclaration Constructor |