hi, I am using event.clientX clientY ,...etc to determine the mouse coordinates works fine when I don't have a scrollbar.
But as soon as I have a scrollbar and scroll down I don't get the popup box poping up at the cursors click position...
Is their any easy way to have my popup box/div tag popup at the exact location of my cursor regardless of if I scrolled down the page or not ....
I just don't know what is going wrong with the coordinate thing?
Are you accounting for the scroll height? Sounds like you are getting the coordinates with one origin (window) and using them in another (document).
If you are using jQuery, it normalizes the Event instance to contain (pageX,pageY) and (screenX,screenY) coordinates in a browser-independent fashion. (You can also easily obtain the scroll amount with the scrollLeft() and scrollTop() methods, if it turns out to be relevant).
- you can use both fixed and absolute positioned elements to display a popup box at the position of the mouse. The difference between fixed and absolute positioning is:
- the placement of fixed positioned elements is always relative to the browser window's client area, so scrolling the document or an element in the document does not modify the placement of fixed positioned elements
- the placement of an absolute positioned element is relative to its first positioned (relative, fixed or absolute) ancestor element. If no positioned parent element exists, the placement is relative to the document. In contrast to fixed positioning, scrolling affects absolute positioning.
So in case of absolute positioned popups you need to know the number of pixels by which the contents of the document are scrolled and if the user scrolls the document while an absolute positioned popup is shown, the popup box scrolls out.
Unfortunately Internet Explorer does not support fixed position before version 7 and it is only supported in STRICT and XHTML document type declarations in IE7.
If you need the number of pixels by which the contents of the document are scrolled, you can use the scrollTop and scrollLeft properties of the HTML element (document.documentElement) in IE and the pageXOffset and pageYOffset properties of the window object in other browsers.
The only problem is that the zoom level (CTRL and +, CTRL and -) affects the value of the scrollTop and scrollLeft properties in IE before version 8.
If the browser is not at the normal zoom level
- the scroll amount is calculated in the default pixel size in Internet Explorer before version 8 even if the current pixel size in the document is different
- from Internet Explorer 8, the scroll amount is calculated in the current pixel size.