Wednesday, 31 October 2018

Mousedown event sensitivity

I have a table grid that highlights cells/checkboxes with click and drag type of functionality.

When a user clicks on a cell and hovers for a while, then the cell / checkbox flickers a lot (firing off a lot of events).

Is there a way to make this less sensitive? i.e., some sort of timing event?

I tried adding .delay to the mouseover toggleclass, but it acts weird.

 $(function () {
        var isMouseDown = false,isHighlighted;

      $("#tablegrid").on('mousedown', 'td.nohighlight', function() {
            isMouseDown = true;
            $(this).toggleClass("highlighted");
            isHighlighted = $(this).hasClass("highlighted");
            var checkBoxes = $(this).find('.dosearchescheckbox :checkbox').trigger('click');
            return false; // prevent text selection
          })

      $("#tablegrid").on('mouseover', 'td.nohighlight', function() {
            if (isMouseDown) {
              $(this).toggleClass("highlighted");
              var checkBoxes = $(this).find('.dosearchescheckbox :checkbox').trigger('click');     
            }
          })
      $("#tablegrid").bind('selectstart', 'td.nohighlight', function() {    
            return false;
          })

      $(document)
        .mouseup(function () {
          isMouseDown = false;
        });
});



from Mousedown event sensitivity

No comments:

Post a Comment