CODEWITHSUNDEEP
svgraphael
Francisc
Francisc

Reputation: 80395

Setting pointer-events:none with Raphael

I'm using this:

circle.attr({
    fill:'#FFFFFF',
    'stroke-width':0,
    opacity:0,
    'pointer-events':'none'
});

The problem is mouse events are still caught and in the DOM inspector that property does not show.

Thanks.

Upvotes: 3

Views: 1180

Answers (1)

methodofaction
methodofaction

Reputation: 72385

Raphael has a whitelist of attributes it can assign to an element. Since pointer-events: none is not supported in VML then this property is not among the whitelist. To work around this you can do...

circle.node.setAttribute("pointer-events", "none");

Alternatively, if all circles are non-clickable you can include in your CSS stylesheet:

circle {
   pointer-events: none;
}

However, none of this will work in any browser that is IE8 or less. If you need old IE support please check out this answer: pointer-events: none VML raphael solution

Upvotes: 7

Related Questions