svg 요소의 'display'속성은 마우스 이벤트에 어떤 영향을 줍니까?

나는이svg 요소의 'display'속성은 마우스 이벤트에 어떤 영향을 줍니까?

<svg style="display:block"> 
</svg>

문제와 같은 HTML 코드는 마우스 이벤트를 캡처 할 수있는 SVG 요소입니다 있습니다. '인라인 블록'과 같은 다른 디스플레이 속성은 같은 효과를냅니다. '인라인'속성을 사용하면 마우스 이벤트를 캡처 할 수 있습니다. 이유 및 수정 방법을 알고 싶습니다. 때문에 크롬의 버그로 이것은 크롬과 오페라 만의 경우

<!DOCTYPE html> 
<html> 
<body onmousedown="alert('body')"> 
<svg style="display:block" width="300" height="300" onmousedown="alert('svg1')"></svg> 
<svg width="300" height="300" onmousedown="alert('svg2')"></svg> 
</body> 
</html>

출처

2013-12-16 Bạch Ngọc Sơn

바라건대 다른 누군가가 기본 질문에 대답 할 수 있기를 바랍니다. 그러나 목표 달성 정도에 따라 대안이 같은 크기의 흰색 직사각형으로 채우는 것과 같을 수 있을지 궁금합니다. 이렇게 뭔가가 http://jsfiddle.net/5hd6D/ – Ian

고마워요! 내 문제를 해결했지만 여전히 주요 질문을 알고 싶다. –

이해하기 쉬운이 시도 : 당신은 파이어 폭스와 같은 다른 브라우저를 선택하면 https://code.google.com/p/chromium/issues/detail?id=379299 (, 당신은 실제로 않는 것을 볼 수 있습니다 예상대로 작동)

수정본 has been committed to the master branch 수정판은 안정적인 버전의 브라우저로 2 개월 이내에 (~ 2014 년 여름까지) 설치해야합니다.

그 사이에 display: block 컨테이너 요소에 <svg>을 래핑하여이 문제를 해결할 수 있습니다 (사용 사례에 따라 다름).

출처

2014-05-30 11:49:22

svg 요소의 'display'속성은 마우스 이벤트에 어떤 영향을 줍니까?

답변

관련 문제