September 20, 2000 - Defining Multiple Filters | WebReference

September 20, 2000 - Defining Multiple Filters

Yehuda Shiran September 20, 2000
Defining Multiple Filters
Tips: September 2000

Yehuda Shiran, Ph.D.
Doc JavaScript

Let's apply both the Engrave filter and the DropShadow filter. Here is the definition and the effect:

<DIV STYLE="width: 40%; filter: progid:DXImageTransform.Microsoft.DropShadow(color='red', 
OffX=3, OffY=2) progid:DXImageTransform.Microsoft.engrave()">
<IMAGE SRC="bicycle.gif"><FONT COLOR="blue">In this page we explain the basics of 
using filters.</FONT>
</DIV>

In this page we explain the basics of using filters.
Notice the space between the two filter specifications (but no spaces between progid: and DXImage). Also observe that the two filters operated on the image in series: the Engrave filter was applied after the DropShadow filter. The specification order determines the application order. Here is our previous example, first engraved, then drop-shadowed:

<DIV STYLE="width: 40%; filter: progid:DXImageTransform.Microsoft.engrave() 
progid:DXImageTransform.Microsoft.DropShadow(color='red', OffX=3, OffY=2)">
<IMAGE SRC="bicycle.gif"><FONT COLOR="blue">In this page we explain the basics of 
using filters.</FONT>
</DIV>

In this page we explain the basics of using filters.
Learn more about filters in Column 68, Introduction to Filters in IE 5.5 and Up.