Drop Shadow filter


This is a test of the Emergency Filtering Network.



Non-transparent background Transparent background

What you should see

Text & Santas with drop shadow filter

Syntax & Settings

For example, the text above has the filter:
filter:dropshadow(color=red,offx=4,offy=4,positive=1,enabled=0)

In STYLE the general form for a DropShadow filter is:

{FILTER: DropShadow(Color=color, OffX=offX, OffY=offY, Positive=positive)}

Color is the name or RGB value of the color for the shadow.
OffX and OffY are the number of pixels to offset the shadow from the object. Positive integers move the shadow to the right or down. Negative integers move the image to the left or up.
Positive can be set to 1 or 0. For normal objects, Positive=1 creates a normal drop shadow and Positive=0 creates a shadow within the non-transparent region with the shadow direction reversed. For transparent objects, the reverse is true.

Test this effect with the images below. We have two images of a red oval on a white background. The left image has red set as the transparent color while the right image has white set as transparent. Note that how the shadows are created, either outside or within the boundary of the oval, depends on how transparency and Positive are set. Note also the direction of the shadow.





Again, the drop shadow will appear only where you've allowed space for it. So the DIV or SPAN for text must have a large enough WIDTH and HEIGHT for your effect. An image must have enough transparent space around the non-transparent portion to hold the drop shadow. The defined edges will chop off the effect!


What you should see Positive=1

Positive=2


© 1997-2002 Jan Smith   <jegs1@jegsworks.com>