Javascript: Make a DIV appear next to an existing element

I’m trying to make a floating login DIV appear next to an ID-specified element (presumably, a text link—something we could easily specify in the HTML, and place wherever we like in the document: maybe at the top of a page, maybe in the body text that talks about logging in to see members-only content, etc.).

I know how to make DIVs appear and disappear by manipulating CSS styles:

(in this case, pop-up box is <div id=“loginpopup” …
link that was clicked has its own ID … say, <a id=“putloginhere” …)



<script language="JavaScript">
function showLogin()
{document.getElementById('loginpopup').style.display='block';}
</script>

<script language="JavaScript">
function showLogin()
{document.getElementById('loginpopup').style.display='none';}
</script>

And, I can position elements when I know where I want them to be. But how can I solve this situation?

Basically, I’d like to write the DIV (<div id=“loginpopup”…) into the page beforehand, set display=none, and then, after clicking the appropriate link (<a id=“putloginhere” …), reposition the DIV to the vicinity of that clicked link and set display=block.

What’s the best way to get that position info.?

Never mind; I sorted it out.