JavaScript Kit > IE Filters reference > Here

Glow Filter

Last updated: October 27th, 2008

The glow filter adds a glow to the outside edges of a content with the desired color and strength. Defined via IE's CSS filter property, here is its basic syntax:


filter: progid:DXImageTransform.Microsoft.Glow(attribute1=value1, attribute2=value2, etc);

Syntax (post IE8):

-ms-filter: "progid:DXImageTransform.Microsoft.Glow(attribute1=value1, attribute2=value2, etc)";

Note: See "Difference in syntax between pre IE8 and IE8+ browsers" for more info on the changes to the filter syntax in IE8+.


<style type="text/css">

width: 90%;
-ms-filter: "progid:DXImageTransform.Microsoft.Glow(color=#000000, strength=10)";
filter: progid:DXImageTransform.Microsoft.Glow(color=#000000, strength=10);


<div id="somediv">Some DIV</div>

Syntax via scripting:

//To define a new Glow filter on an element ="progid:DXImageTransform.Microsoft.Glow(attribute=value1, attribute2=value2)"

To access an existing property within the Glow filter:

//To access an existing property within the Glow filter via the filters[] object
object.filters[x].Property1=value1 //where "x" is the position of the filter within list of filters on element

When getting or setting a specific filter's attribute via scripting, you capitalize the attribute to turn it into a property.

Below lists the attributes/properties of the Glow filter:

Glow Filter attributes (properties)

Attributes/ Properties Description
enabled Sets/ returns whether the filter is enabled or not. Default is true.

Valid values: true/ false

color Read/Write hexadecimal color value that determines the color of the glow formed

Valid values: All valid #RRGGBB hexadecimal colors or color names.


<style type="text/css">

width: 90%;
-ms-filter: "progid:DXImageTransform.Microsoft.Glow(color=red, strength=5)";
filter: progid:DXImageTransform.Microsoft.Glow(color=red, strength=5);


<h1 id="myheader">Hot News</h1>


Hot News

Strength Sets the strength, or distance (in pixels) in which the glow spreads. Default is 5.

Valid values: 1 - 255


<style type="text/css">

-ms-filter: "progid:DXImageTransform.Microsoft.Glow(color=white, strength=5)";
filter: progid:DXImageTransform.Microsoft.Glow(color=white, strength=5);


<img id="butterfly" src="butterfly.jpg" onMouseover="this.filters.item(0).Color='orange'" onMouseout="this.filters.item(0).Color='white'" />

Demo (move mouse over):

Reference List

[an error occurred while processing this directive]

CopyRight (c) 2018 JavaScript Kit. NO PART may be reproduced without author's permission. Contact Info