Javascript:Object x/y Coordinates

Found this cool javascript to fetch the x & y coordinates of a named javascript object. It’s at: http://www.mattkruse.com/javascript/popupwindow/combined_source.html To get it to work with my popup menus, I do the following:


-in <HEAD> tag:

<SCRIPT LANGUAGE=”JavaScript1.2″ SRC=”menu.js”></SCRIPT>
<SCRIPT LANGUAGE=”JavaScript1.2″>
<!–
function loadMenus() {
//Dynamic Menus
window.rptsMenu = new Menu(“Reports”);

//OPTIONAL PARMS FROM MENU.JS.20L
window.rptsMenu.menuItemBgColor = “black”;
window.rptsMenu.menuItemWidth = 120;
window.rptsMenu.fontColor = “#005eac”;
window.rptsMenu.menuBorderBgColor = “#005eac”;
window.rptsMenu.addMenuItem(“Menu Text 1”, “location=’url_2_somewhere'”);
window.rptsMenu.addMenuItem(“Menu Text 2”, “location=’url_2_somewhereelse'”);

window.adminMenu = new Menu(“Admin”);

//OPTIONAL PARMS FROM MENU.JS.20L
window.adminMenu.menuItemBgColor = “black”;
window.adminMenu.menuItemWidth = 120;
window.adminMenu.fontColor = “#005eac”;
window.adminMenu.menuBorderBgColor = “#005eac”;
window.adminMenu.addMenuItem(“Menu Text 1”, “location=’url_2_somewhere'”);

window.rptsMenu.writeMenus();
window.adminMenu.writeMenus();
}

… -in middle of HTML, the actual links on which to pop up menus just below:

(Note, onmouseover Y=+17, onClick Y=-3: this causes menu to appear below link, but if abUser clicks the link,
the menu is moved up 20 pixels so that his cursor is now on the 1st item – to let him know that he must select an item from the menu here)! Change “#” to a url & -3 to +17 if you desire an actual link above the menu!

<a name=”rptlink” id=”rptlink” href=”#” onmouseover=”javascript:window.showMenu(window.rptsMenu,rptCoords.x-2,rptCoords.y+17);” onClick=”javascript:window.showMenu(window.rptsMenu,rptCoords.x-2,rptCoords.y-3);”>
<font size=”4″>Top Link1 Text</font></a>
<a name=”adminlink” id=”adminlink” href=”/orca/index.htm” onmouseover=”javascript:window.showMenu(window.adminMenu,adminCoords.x-2,adminCoords.y+17);” onClick=”javascript:window.showMenu(window.adminMenu,adminCoords.x-2,adminCoords.y-3);”>
<font size=”4″>Top Link2 Text</font></a>

… -at bottom of HTML just before </body>: (DONT FORGET THIS!)

<SCRIPT LANGUAGE=”JavaScript1.2″>
<!–
rptCoords = getAnchorPosition(“rptlink”);
adminCoords = getAnchorPosition(“adminlink”);
loadMenus();
//–>
</SCRIPT>

Advertisements

Feel Free to Comment (Name/Email/Website optional):

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: