display top left corner of div relative to mouse click event

Question

Using JavaScript (jQuery not available here) How do I display the top left corner of my div relative to my mouse click location? The following seems to work until I have to scroll my page and then it becomes inaccurate.

    function MyJsFx() {
        var div1 = document.getElementById('noteContent');
        div1.style.display = "block";
        div1.style.top = event.clientY + 'px';
        div1.style.left = event.clientX + 'px';
    }

Answer 1

Use window.scrollY and window.scrollX as scrolling offsets. You can then subtract the the window scroll position from the values you already have to get a relative position value.

Answer 2

Somethime using javascript is not cross-browser.

You need detected browser before use method event.clientY or window.scrollY