notarypublic
New Member
This site is a tweaked version of one I posted earlier - I'm playing around with CSS3 and jquery. The site isn't anything close to being finished, at this point it's more of a proof of concept... but I'm getting there.
Currently, you'll see the red div that floats over the navigation bar. In the mockup I made in jsFiddle, the red div should float across the navigation menu to wherever the mouse is. On my site, as soon as you move your mouse over the navigation bar, the div springs to the right.
The reason for this is because the variable that stores the mouse location is relative to the left side of the window - this changes depending on the size of the window, making the formula I'm using work incorrectly. Obviously this variable needs to be based around the width of the container, not the width of the page.
I'm still pretty new at jquery (but learning quickly!) - I didn't realize that pageX was a variable that you could get from the DOM. Is there a similar way to grab a mouse's position in relationship to the edge of any other elements?
Currently, you'll see the red div that floats over the navigation bar. In the mockup I made in jsFiddle, the red div should float across the navigation menu to wherever the mouse is. On my site, as soon as you move your mouse over the navigation bar, the div springs to the right.
The reason for this is because the variable that stores the mouse location is relative to the left side of the window - this changes depending on the size of the window, making the formula I'm using work incorrectly. Obviously this variable needs to be based around the width of the container, not the width of the page.
I'm still pretty new at jquery (but learning quickly!) - I didn't realize that pageX was a variable that you could get from the DOM. Is there a similar way to grab a mouse's position in relationship to the edge of any other elements?
