웹킷 브라우저에서 크기를 조절할 때 왜 SVG가 흐려 집니까?

CSS 스케일 변환을 사용하여 SVG 이미지를 크기 조정할 때 이미지가 Chrome 또는 Safari에서 흐리게 표시됩니까? 어떤 도움웹킷 브라우저에서 크기를 조절할 때 왜 SVG가 흐려 집니까?

 #logo { 
      animation: cssAnimation 120s infinite; 
      -webkit-animation: cssAnimation 120s infinite; 
      -moz-animation: cssAnimation 120s infinite; 
     } 

     @keyframes cssAnimation { 
      0% { transform: scale(1) } 
      50% { transform: scale(2) } 
      100% { transform: scale(1); } 
     }

많은 감사 : 여기

내 코드의 비트가!

라파엘

출처

2014-10-22 user1875631

http://stackoverflow.com/questions/26488179/images-losing-quality-for-second-when-interacting-with-page 또는 http://stackoverflow.com/questions/9986226/when-scaling을 참조하십시오. -an-element-with-css3-scale-it-become-pixelated-just-after-t가 질문에 대답 할 때까지 ... – War10ck

'width'를 사용해보세요 http://jsfiddle.net/victor_007/bw0fyu11/ –

@ War10ck 덕분에 많이! – user1875631

감사합니다. War10ck! 이 기사가 나를 도왔습니다 : when scaling an element with css3 scale, it becomes pixelated until just after the animation is complete. I'm animating an element with a border 스케일 대신 scale3d를 사용하여 1을 넘지 말고 트릭을 만들었습니다!

출처

2014-10-22 22:12:00 user1875631

웹킷 브라우저에서 크기를 조절할 때 왜 SVG가 흐려 집니까?

답변

관련 문제