Cursor goes to wrong position when scroll

[Horray]

I'm using the colorwheel picker from the demo page, and I came up with a problem. When I add text above the color wheel, then scroll down and change the colorwheels color, the colorwheels cursor isn't contained in the actual circle. (It makes an imaginary circle in another place, and the colorwheels cursor is constrained in that imaginary circle.)

Another issue, which might be related to the first one is that if you zoom up in the browser, (in chrome: ctrl +) the colorwheels cursor stays position like a fixed element, it follows the scrolling.

How can I get the colorwheels cursor to always stay in the circle?

I think the relevant code is the function of getOrigin

JSFiddle

[PitPik]

Hi @Horray , the problem is a bit simpler than you probably think ;o) You changed the code a bit, so you removed the function getPageXY and replaced the coordinates from e.pageX (and y) to e.clientX, that's probably why you also added + doc.body.scrollTop + doc.documentElement.scrollTop) - 1 (and so on) to the code in renderHSVPicker(). See https://jsfiddle.net/Lsb1kgxh/2/ for the updated version... Good luck!!

[Horray]

It finally works! I've been trying to figure it out from yesterday!! Thank you very much!

I posted the question in StackOverflow, so if you want to answer it, go ahead! http://stackoverflow.com/questions/34756776/element-goes-to-wrong-position-when-scroll

[Horray]

How would I do it with the getPageXY function? Can you please show me another JSFiddle with the getPageXY function?