指针事件：无VML raphael解决方案

问题描述：

我在使用jQuery的Raphael元素上实现了 pointer-events：none ：

I have implemented pointer-events: none on a Raphael element using jQuery like this:

var raphaelElement = Raphael.ellipse(x,y,w,h);
$(raphaelElement.node).css({'pointer-events': 'none'});

这很好但当然在IE8中，Raphael使用VML而不是SVG，这个解决方案失败了。

This works fine but of course in IE8, Raphael uses VML instead of SVG and this solution fails.

有没有人有另一个解决方案来基本上让Raphael元素忽略事件。

Does anyone have another solution to essentially make a Raphael element ignore events.

答

使IE8（及更早版本）工作的唯一方法是实际捕获事件，并在事件处理程序中：

The only way to make this work for IE8 (and earlier) would be to actually catch the event, and in the event handler:

隐藏元素（ .style.display ='none'）

使用 elementFromPoint（） 找到'捕手'下面的下一个元素的方法

重新创建并触发该元素上的事件（另请参阅这个）

再次显示捕手（ .style.display =''）

hide the element (.style.display='none')
use the elementFromPoint() method to find the next element below the 'catcher'
re-create and fire the event on that element (see also this)
show the catcher again (.style.display='')

这种通用方法（减去第3步）已经在IE上使用了10多年，允许用户用它拖动一个元素直接在光标下，同时仍然检测到下面可能的放置目标元素的鼠标悬停。

This general approach (minus step 3) has been used for over 10 years on IE to allow the user to drag an element with it directly under the cursor while still detecting the 'mouseover' of possible drop target elements underneath.

指针事件：无VML raphael解决方案

相关推荐