Prevent hover triggering for div in raphael

Question

I need to draw custom dom tooltip over raphael svg element. How to prevent event triggering mouseleave for element, when you hover tooltip?

Check this example:

$(c.node).mouseenter(function(){
    tipText = 'text';
    tip.show();
    over = true;
}).mouseleave(function(){
    tip.hide();
    over = false;
});

http://jsfiddle.net/QK7hw/707/

Answer 1

Try adding the style

pointer-events: none;

To the tooltip, that should stop the odd hover flashing.

jsfiddle