filter - DropShadow() (Filter/visual)

A visual filter for creating drop shadows.

Availability:

JScript - 3.0
Internet Explorer - 4.0
Object properties:Enabled, OffX, OffY, Positive , Color
Supported by objects:A, ACRONYM, ADDRESS, B, BDO, BIG BLOCKQUOTE, body, BUTTON, CAPTION, CENTER, CITE, CODE, custom, DD, DFN, DIR, DIV, DL, DT, EM, FIELDSET, FONT, FORM, FRAME, Hn, I, IFRAME, IMG, INPUT, INS, KBD, LABEL, LEGEND, LI, MARQUEE, MENU, NOBR, OL, P, PLAINTEXT, PRE, Q, RT, RUBY, runtimeStyle, S, SAMP, SMALL, SPAN, STRIKE, STRONG, style, SUB, SUP, TABLE, TD, TEXTAREA, TH, TT, U, UL, VAR, XMP

This visual filter creates drop shadow effects. These are quite useful for lifting control elements out of the page to make them more readily visible.

The following properties are supported:

The example shows the effect of adding a drop shadow to an image. In this example, you will see that the shadow has a hard edge created by a point source of light - you may want to use the Blur filter to provide a more natural effect with soft edges.

Warnings:

Example code:

   <HTML>
   <HEAD>
   </HEAD>
   <BODY>
   Normal--&gt;
   <IMG ID="NORMAL" SRC="./Logo150.gif">
   Filtered--&gt;
   <IMG ID="MYIMAGE" SRC="./Logo150.gif">
   <BR>
   <SCRIPT>
   myFilter = "progid:DXImageTransform.Microsoft.DropShadow(offx=10, offy=10, positive=1, color=gray)";
   document.all.MYIMAGE.style.filter = myFilter;
   </SCRIPT>
   </BODY>
   </HTML>

See also:color value, Filter object, style.filter

PropertyJavaScriptJScriptNIEOperaNESECMADOMCSSHTMLNotes
Enabled n/a3.0 3.0 n/a4.0 4.0 n/a n/a n/a n/a n/a n/a-
OffX n/a3.0 3.0 n/a4.0 4.0 n/a n/a n/a n/a n/a n/aWarning
OffY n/a3.0 3.0 n/a4.0 4.0 n/a n/a n/a n/a n/a n/aWarning
Positive n/a3.0 3.0 n/a4.0 4.0 n/a n/a n/a n/a n/a n/aWarning
Color n/a3.0 3.0 n/a4.0 4.0 n/a n/a n/a n/a n/a n/aWarning