CSS3 애니메이션 불포화 핸드

Question

이미지에 불포화기를 사용하여 흑백으로 만듭니다. (CSS3 전환을 사용하여) 호버 (hover)에서 색상으로 다시 변색하고 싶지만이 기능을 사용할 수없는 것 같습니다. 어떤 아이디어? 여기

는 예입니다 : 아래 http://jsfiddle.net/sChY5/와하면 좋은 클래스 선택에 transition 속성을 넣어하지 않았다 내 CSS를

img.desaturate { 
-webkit-transition: all 0.2s ease-in-out; 
-moz-transition: all 0.2s ease-in-out; 
-o-transition: all 0.2s ease-in-out; 
transition: all 0.2s ease-in-out; 
filter: grayscale(100%); 
-webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); 
-ms-filter: grayscale(100%); -o-filter: grayscale(100%); 
filter: url('data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale'); 
filter: gray; 
-webkit-filter: grayscale(1); 
} 

img.desaturate:hover { 
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale"); 
-webkit-filter: grayscale(0%); 
} 

Answer 1

입니다.

는 img.desaturate:hover에이 아니어야하지만,

img.desaturate에

Answer 2

난 그냥 그것을 확인

(난 당신이 여기에 게시 한 동일한 코드하지 않은, 당신의 jsfiddle 데모에 대해 이야기)하고 jsfiddle에서 작동있어 당신이 생각하는대로 또는 당신이 원하는 것은 명확히하십시오.