0

I'm having trouble loading gradients in IE9. I generated it using colorzilla which includes an IE conditional comment for deactivating filters, so that IE9's svg component is used instead. When I open up the page in IE9, it renders correctly until I hit the button for "allow blocked content."

I've tried futzing with the meta and html tags, and also deleting the scripts to see if one of them was interfering. No dice.

Here's the code for my head section:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="EN" dir="ltr" xmlns="http://www.w3.org/1999/xhtml">

<head>
<title>Tahoe Motion Picture Rentals</title>
<!--<meta http-equiv="content-type" content="text/xml; charset=utf-8" />-->
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> 

<!--[if gte IE 9]>
<style type="text/css">
.gradient {
filter: none;
}
</style>
<![endif]-->

<link rel = "stylesheet" type = "text/css"href = "picturePage - Hor. Menu.css" />
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/buttonClick.js"></script>
<script type="text/javascript" src="js/jquery.color.js"></script>

</head>

Thank you ahead of time for any help. It's been driving me nuts.

Jason
  • 11
  • 1

1 Answers1

1

Even though colorzilla outputs the code with just "filter", apparently the "-ms-" prefix is needed. Interestingly enough, I used filter/svg on another element and it did work without the "-ms-" prefix. I think maybe it has to do with whether or not there are multiple color-stops. Also, I think I read somewhere, filter will not work at all in IE8 without the prefix.

Jason
  • 11
  • 1