13

To create a linear gradient in Internet Explorer i used to adopt this (terrible) code:

filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#282828', EndColorStr='#185976');

I wonder wether exists a way to create a radial gradient using filter and DXImageTransoform ?

MatterGoal
  • 16,038
  • 19
  • 109
  • 186

1 Answers1

33

Live Demo

#element{
    background: #fff; /* The color you want for the radial gradient */
    width:100px; 
    height:100px;
    filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100, finishopacity=0, style=2);
}

Link where I got the info

Radial Gradient

For the Radial Gradient we have to create a div-elements. This element is a Overlay for the background. Than we'll use the Alpha-Filter. Alpha will make this element transparent in a special style. style=2 is a radial alpha. This means that the center of the element will be full colored (opacity=100) and the opacity will lose to the edges (finishopacity=0)

Loktar
  • 34,764
  • 7
  • 90
  • 104
  • 2
    brilliant!! it's even work with background-image underneath it! http://jsfiddle.net/edr4M/ i'm not sure about background: transparent; but thats nothing 1px transparent.gif can't fix..! – Asaf Katz Jun 25 '12 at 19:49
  • 1
    I risked my account's security signing onto my SO on an unknown network to offer you an upvote. Thanks (3 year anniversary) – th3byrdm4n Jun 23 '14 at 18:14
  • An old post this be, I know. However, I cannot get jsfiddle to work in ie8! – Wildcard27 May 17 '15 at 09:50