ポインタイベント

Question

私は、次の例があります。でも、これらのSVGファイル内のいくつかの要素の上に：「ポインタカーソル」クリックイベントに追加し、私が表示したいと思い

http://jsfiddle.net/klodoma/3m3dmdtw

を。 SVGがオーバーレイしています。

"基本要素" - 青色の長方形にマウスオーバーを追加するにはどうすればよいですか？それも可能ですか？

<path fill="#000000" stroke="#000000" d="M338,293L338,293L164,230L164,230M338,293L934,307L733,59L164,230" stroke-width="30" stroke-opacity="0" fill-opacity="0" class="el-seq-7591 el-model-7591-76627 el-model-76627" transform="matrix(1,0,0,1,-76,79)" style="-webkit-tap-highlight-color: rgba(0, 0, 0, 0); stroke-opacity: 0; fill-opacity: 0; cursor: pointer;"></path> 

Answer 1

[OK]を、私は解決策を発見しました。

答えは "pointer-events：none;"であり、これは "親"要素に置くことができます。これは、 "ポインタイベント：すべて"の子要素からのすべてのポインタイベントが転送されることを意味します。

http://jsfiddle.net/klodoma/ox6pwjt2/

.stage-item { 
    position: absolute; 
    top: 0; 
    left: 0; 
    background-color: transparent; 
    pointer-events: none; 
} 

.el-seq-7591 { 
    pointer-events: all; 
}