click - javascript document onmousedown cancels element onclick -

click - javascript document onmousedown cancels element onclick -

i have document.addeventlistener('mousedown', ...) performing visual feedback user. have dynamicaly created elements elem.addeventlistener('click') not fired. if remove document mousedown listener clicks on elements triggered (or if alter document's mousedown click event). why , how solve this? realy need document handle mousedown , still able elements recieve click/tap events.

fiddle: http://codepen.io/hpet/pen/izpjk if uncomment document mousedown event, element receives click ok, otherwise click on element never triggered.

fiddle updated. uncomment lines 22/23 (setting position) not fire click event.

the root cause of problem overlapping elements.

since you're moving circle element on top of square element in mousedown handler, subsequent mouseup event triggered on circle. since event not triggered on square element, no click event generated.

if have maintain circle element on top of square, can utilize pointer-events css rule forcefulness mouse events "go through" circle element.

javascript click conflict mousedown