IE9 Inoltra gli eventi del mouse attraverso un elemento di mascheratura della tela

Question

I miei elementi canvas posizionati in modo assoluto bloccano tutti gli eventi del mouse in modo che non sia possibile fare clic su di essi, lo stesso problema menzionato here e here.

Ho più livelli di canvas che devono essere a z-index specifici, quindi ho bisogno di inoltrare gli eventi del mouse attraverso le tele. pointer-events: none; opere in buone browser, ma per IE9 ho bisogno javascript per farlo, ecco la mia soluzione attuale,

var evts = [ 'click', 'mousedown', 'mouseup', 'dblclick'], 
       canvases = $('canvas'); 

      $.each(evts, function(_, event){ 
       canvases.bind(event, function(evt){ 
        var target, 
         pEvent; 
        $(this).hide(); 
        target = document.elementFromPoint(evt.clientX, evt.clientY); 
        $(this).show(); 
        pEvent = $.Event(event); 
        pEvent.target = target; 
        pEvent.data = evt.data; 
        pEvent.currentTarget = target; 
        pEvent.pageX = evt.pageX; 
        pEvent.pageY = evt.pageY; 
        pEvent.result = evt.result; 
        pEvent.timeStamp = evt.timeStamp; 
        pEvent.which = evt.which; 
        $(target).trigger(event, pEvent); 
       }); 
      }); 

esempio di lavoro, jsFiddle

domande;

1. Sto creando il nuovo evento e passando sopra i dati rilevanti, sarebbe sicuro passare la var evt con target e currentTarget modificati?

2. Come posso propogare un clic con il tasto destro?

O qualcuno ha un modo migliore per realizzare questo? Le altre domande correlate sono piuttosto vecchie.

Answer 1

Non c'è pulito modo per passare gli eventi cross-browser. È possibile passare l'evento (modificato) ma non si può garantire che funzionerà come potrebbe naturalmente, in particolare il browser.

Per tasto destro del mouse utilizzando il codice solo fare questo: http://jsfiddle.net/6WMXh/20/

(si è utilizzato la metà della parte jquery informazioni in più, ma non ha mai fatto nulla con esso)