如何在CSS中通过转换改变灰度

我需要更改悬停时的Filter:Grayscale，但由于代码中的Transition属性，我无法传输Filter:Grayscale（）值

我使用了FireBug，看到灰色选择器的悬停状态为空

.gray
{
 filter: url("data:image/svg+xml;utf8,<svg%20xmlns='http://www.w3.org/2000/svg'><filter%20id='grayscale'><feColorMatrix%20type='matrix'%20values='0.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200.3333%200.3333%200.3333%200%200%200%200%200%201%200'/></filter>    </svg>#grayscale"); /* Firefox 3.5+ */
filter: gray; /* IE6+ */
filter: grayscale(100%); /* Current draft standard */
-webkit-filter: grayscale(1); /* New WebKit */
-moz-filter: grayscale(1);
-ms-filter: grayscale(1); 
-o-filter: grayscale(1);



-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius:15px;
-webkit-transition-property:all;
-webkit-transition-duration: 0.5s, 0.5s;
-webkit-transition-timing-function: linear, ease-in;
-moz-transition-property:all;
-moz-transition-duration:1s;
-moz-transition-timing-function: linear, ease-in;
-o-transition-property:all;
-o-transition-duration:0.5s;
-o-transition-timing-function: linear, ease-in;
}

.gray:hover 
{
filter:none;
filter: grayscale(0%); /* Current draft standard */
-webkit-filter: grayscale(0); /* New WebKit */
-moz-filter: grayscale(0);
-ms-filter: grayscale(0); 
-o-filter: grayscale(0);


}

.gray
{
过滤器：url（“数据：图像/svg+xml；utf8，#灰度”）；/*Firefox 3.5+*/
过滤器：灰色；/*IE6+*/
过滤器：灰度（100%）；/*当前标准草案*/
-webkit过滤器：灰度（1）；/*新webkit*/
-moz滤波器：灰度（1）；
-ms过滤器：灰度（1）；
-o-滤波器：灰度（1）；
-webkit边界半径：15px；
-moz边界半径：15px；
边界半径：15px；
-webkit转换属性：全部；
-webkit过渡持续时间：0.5s，0.5s；
-webkit过渡计时功能：线性，易用；
-moz转换属性：全部；
-moz转换持续时间：1s；
-moz过渡计时功能：线性，易用；
-o-过渡性质：全部；
-o-过渡持续时间：0.5s；
-o-过渡-定时-功能：线性，易用；
}
格雷：悬停
{
过滤器：无；
过滤器：灰度（0%）；/*当前标准草案*/
-webkit过滤器：灰度（0）；/*新webkit*/
-moz过滤器：灰度（0）；
-ms过滤器：灰度（0）；
-o-过滤器：灰度（0）；
}

你能确定一下吗？当然。在jsfiddle.net中它是有效的，但在我的网页中不是！可能是因为其他问题？