shadow effect around a POpup

[fixthebug2003]

Hi,
I have IE 5.5. I am using <DIV> tags to display a popup. How can we create shadow effect on the DIV tag. especially on the right border and the bottom border?

Fixthebug2003

 

[vongrunt]

If IE5.5+ is requirement try DropShadow filter:

http://msdn.microsoft.com/workshop/samples/author/dhtml/DXTidemo/DXTidemo.htm

 

[BillyRayPreachersSon]

Add this to your DIV's style:

filter: "progid:DXImageTransform.microsoft.shadow(color='#666666', direction=135, strength=4)";

Obviously, you can change the colour, direction, and strength to suit ;o)

hope this helps,
Dan

 

[fixthebug2003]

Hi,
I tried this and it works..but...
I applied the shadow Filter on the <DIV> tag and the shadow appears around the div tag....but it also applies the shadow to all the elements ( like text etc) inside the <DIV> tag.
Is this a bug in IE and if yes is there a fix?


Fixthebug2003

 

[BillyRayPreachersSon]

Hmm strange - I don't get that problem. You could try something like this, assuming your DIV had an ID of "myDiv":

#myDiv {
   filter: "progid:DXImageTransform.microsoft.shadow(color='#666666', direction=135, strength=4)";
}
#myDiv * {
   filter: none;
}

Hope this helps,
Dan