title: css pointer-events property change and respective jquery events not triggering together
body: <p>Here is my code segment. I am using iscroll 4 for scroll in touch devices and desktop.</p>
  
  <pre><code>$('#next_item').bind('mousedown touchstart',function (e) {
          //do something onclick
          $(this).bind('mousemove touchmove',function(e){ //triggers only when i drag over it                 
                  dragstart = true;
                  $(this).css('pointer-events', 'none');
                  myScroll._start(myDown);
                  return;                     
          });
  });
  
  $('#next_item').bind('mouseup touchend',function (e) {
       if(dragstart) {
          dragstart = false;
          $(this).css('pointer-events', 'auto');
       }
  });
  </code></pre>
  
  <p>I have the click event on <code>#next_item</code> which does a specific task and also have the drag event on <code>#next_item</code> which does different task. Now the problem is when <code>#next_item</code> receives drag event the <code>css pointer-events</code> is changed to <code>none</code> immediately but the drag is not triggering. When i do <code>mouseup</code> and then again drag from over <code>#next_item</code> then only the drag is triggered. I need the <code>css pointer-events</code> to pass drag event to the underlying element. Please suggest if i am doing anything wrong. Without <code>pointer-events</code> iscroll gives error while passing the drag event below <code>#next_item</code></p>