CODEWITHSUNDEEP
javascriptcssangularjshtmlmouseevent
abejdaniels
abejdaniels

Reputation: 459

How do you "bypass" mouse up?

I am trying to make it so that when a user clicks down, this happens.

In order,

Does something. (Not being specific, this isn't the important part.)

Mouse up is triggered.

Using: angular, html, css. Not using: jQuery

Any suggestions? Thanks!

Upvotes: 0

Views: 224

Answers (2)

XAMPPRocky
XAMPPRocky

Reputation: 3599

You attach two event listeners, one while the user has the mouse pressed down mousedown. Once the user lets go the mouseup event is triggered. All mouse event listeners are passed an event object you can use to get information about the event ie: mouse x, and y positions.one of the methods available is event.preventDefault() this will stop the browser doing what it usually wants to do. Example: cmd/ctrl + s will cause the browser to save the html page. preventDefault will stop this.

document.addEventListener('mousedown' function (event) {
    // Do something
})
document.addEventListener('mouseup', function (event) {
    event.preventDefault()
})

To address OP comment:

var noMouseUp = true
document.addEventListener('mousedown', function () {
  if (noMouseUp) {
      // do something
      noMouseUp = false
  }
})
document.addEventListener('mouseup', function (event) {
 if (!noMouseUp) {
    noMouseUp = true
 }

})

Upvotes: 1

3pic
3pic

Reputation: 1219

Use events.preventDefault(); in the mouseup callback.

Use, right after, event.stopPropagation(); to avoid the event passing to other layered elements.

bypassed_element.onclick = function(event){

      event.preventDefault();
      event.stopPropagation();
};

Upvotes: 0

Related Questions