SVG 용 CSS 애니메이션이 작동하지 않습니다.

Question

이 애니메이션은 SVG에서 작동해야한다는 것을 HTML 요소에서와 마찬가지로 이해하지만 분명히 잘못되었습니다!

SVG에서 CSS로 어떻게이 효과를 얻을 수 있습니까? Fiddle here.

div { 
    background: blue; 
    width: 400px; 
    height: 100px; 
    animation-name: example; 
    animation-duration: 4s; 
    animation-iteration-count: infinite; 
} 

@keyframes example { 
    0% { 
    filter: brightness(1); 
    filter: contrast(1); 
    -webkit-filter: brightness(1); 
    -webkit-filter: contrast(1); 
    } 
    50% { 
    filter: brightness(0.1); 
    filter: contrast(0.1); 
    -webkit-filter: brightness(0.1); 
    -webkit-filter: contrast(0.1); 
    } 
    100% { 
    filter: brightness(1); 
    filter: contrast(1); 
    -webkit-filter: brightness(1); 
    -webkit-filter: contrast(1); 
    } 
} 

Answer 1

변경합니다 svg에 CSS에서 div. 그것은 나를 위해 작동합니다.

아니면 모두 div and svg보고 싶다면, 단지 div, svg { css code..}

예 추가 http://jsfiddle.net/4ebv7jzd/1/