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.?