Welcome to WebmasterWorld Guest from

Forum Moderators: open

Message Too Old, No Replies

x & y position in JavaScript

8:39 am on Mar 22, 2003 (gmt 0)

10+ Year Member

Here's the line: got a JS I modified, which produces a dropdown JS menu as a site navigation tool. The postioning of the drop down menus is set by X&Y position.

Here's the problem, if you set the X&Y from a 1024x764 resolution, all is fine, but obviously this changes when the menu is viewed at either a smaller or larger resolution. The X&Y postion changes because of the smaller or larger resolution, thus blowing the alignment of the menus.

Is there a way to make the X&Y position relative to the actual screen size, so that not matter what resolution was used the drop down menus would hold their proper placement, in relation to the main menu they drop down from?

**Note-the page this script is used on is set to 100% width due to space requirements. If I were to set the menu size to a width such as 760px as well as the main table, this would solve the problem, but anything less than 100% width is really a good solution.

Here's a snippet of the actual link script:
(you can see below the x&y as 9 & 107 respectively)

<A href="" onmouseover="MM_showMenu(window.mm_menu_0930130724_0,9,107,null,'header_instructor')" onmouseout="MM_startTimeout();"><img src="images/club_menu.gif" width="151" height="22" border="0"></a>

1:48 pm on Mar 22, 2003 (gmt 0)

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member

You can check for inner width this way:


Note that this check has to be done after the <body> tag. Now you can use percent values against the winWidth value (rounded off)...

6:12 pm on Mar 22, 2003 (gmt 0)

10+ Year Member

Doc, thanks! Would I incorporate the code you presented into a new script within the body tag or would the snippet you presented be a new script?

I guess I am confused as to how to implement the snippet you provided. I am not real experienced with JavaScipt. :(

8:32 pm on Mar 22, 2003 (gmt 0)

WebmasterWorld Senior Member drdoc is a WebmasterWorld Top Contributor of All Time 10+ Year Member

Now, say that you want to figure out how many pixels "15%" are... instead of passing the pixel values for x & y you pass the percentage


Then, inside your MM_showMenu function you calculate how many pixels that is equivalent to.

For example:

<script type="text/javascript">

function MM_showMenu(blah,x,y,blah) {
new_x = Math.round(winWidth*x);
new_y = Math.round(winWidth*y);


Now you have the pixels and can use them for positioning.

Hope this example made sense...

11:13 pm on Mar 22, 2003 (gmt 0)

10+ Year Member

Hmm, OK, I understand what you are saying Doc, but here are my questions.

1. Is the example script you presented in addition to the script I am already using?

2. Could you present the example script you created as an actual script and not an example. In other words, a script that would actually work (with values that would not necessarily work) but would allow me to modify the script after I determine the math?

3. So in essense, (1)I will have the JS on the server, (2)the JS that determines the individual parameters in the head section. (3) This line within the body section:<script language="JavaScript1.2">mmLoadMenus();</script> (4)And the JS example you provided?

I am getting close, but still a bit lost. Thanks for your patience. ;)