How to decide the triggering order of different mouseDown function

Question

I have two kinds of functions which will detect the mousedown event and trigger some functions.

1. window.onmousedown = function(...)

2. Raphael object:
var rec = paper.rect(10,10,10,10)
rec.mousedown(...)

the second one is a rectangle create by Raphael.js and the function will be triggered when you click the rectangle.

I need the second one to be triggered before the first one, but it seems that the order of triggering of the two functions is randomly decided by the browser?

Do I have any way to control it !?

thanks!!

Answer 1

I need the second one to be triggered before the first one

---

Look at the DEMO, mousedown even triggers on circle before window's.

window.onmousedown = function()
{
    alert('Yes');
}

var paper = new Raphael(document.getElementById('paper'),500,400);

var circle = paper.circle(100,100,50).attr({fill:'orange', stroke:'green', 'stroke-width':3});
circle.mousedown(function() {
    alert('No');
    this.attr({fill:'green', stroke:'red', 'stroke-width':3});
});

circle.mouseout(function() {
    this.attr({fill:'orange', stroke:'green', 'stroke-width':3});
});

Click on the circle and see that the alerts. Good luck