pointer-events: none VML raphael solution

Question

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

var raphaelElement = Raphael.ellipse(x,y,w,h);
$(raphaelEle         


        

Answer 1

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

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

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.