Position div next to element

[johkar]

I want to position an absolutely positioned div 75px above the button
clicked on. The following is what I have so far, but as you can tell
it needs more work. I want it positioned in relationship to the button
within the window, not the entire screen...and scrolling the window
shouldn't effect it. Just need some pointers please.

<script type="text/javascript">
function showEmployee(elm,x,y){
if(document.getElementById('awardDiv')){
var myElm=document.getElementById('awardDiv');
myElm.style.display='block';
myElm.style.left=(x - myElm.clientWidth/2) +'px';
myElm.style.top=(y + 25) +'px';
}
}
</script>
<input type="button" name="myButton" value="Select Another Employee"
onclick="showEmployee(this,event.clientX,event.cli entY)">

[petermichaux]

johkar wrote:

I want to position an absolutely positioned div 75px above the button
clicked on. The following is what I have so far, but as you can tell
it needs more work. I want it positioned in relationship to the button
within the window, not the entire screen...and scrolling the window
shouldn't effect it. Just need some pointers please.

<script type="text/javascript">
function showEmployee(elm,x,y){
if(document.getElementById('awardDiv')){
var myElm=document.getElementById('awardDiv');
myElm.style.display='block';
myElm.style.left=(x - myElm.clientWidth/2) +'px';
myElm.style.top=(y + 25) +'px';
}
}
</script>
<input type="button" name="myButton" value="Select Another Employee"
onclick="showEmployee(this,event.clientX,event.cli entY)">

Where is awardDiv? Does it have styles applied from a stylesheet?

Have you tried the positioning in an HTML document that does not use
JavaScript so that you can get the CSS would like to implement with
JavaScript correct first?

Peter

[johkar]

pe**********@gmail.com wrote:

johkar wrote:

I want to position an absolutely positioned div 75px above the button
clicked on. The following is what I have so far, but as you can tell
it needs more work. I want it positioned in relationship to the button
within the window, not the entire screen...and scrolling the window
shouldn't effect it. Just need some pointers please.

<script type="text/javascript">
function showEmployee(elm,x,y){
if(document.getElementById('awardDiv')){
var myElm=document.getElementById('awardDiv');
myElm.style.display='block';
myElm.style.left=(x - myElm.clientWidth/2) +'px';
myElm.style.top=(y + 25) +'px';
}
}
</script>
<input type="button" name="myButton" value="Select Another Employee"
onclick="showEmployee(this,event.clientX,event.cli entY)">

Where is awardDiv? Does it have styles applied from a stylesheet?

Have you tried the positioning in an HTML document that does not use
JavaScript so that you can get the CSS would like to implement with
JavaScript correct first?

Peter

Thanks for the reply. I actually realized from another post that I
needed to put a relative positioned div around my absolute positioned
div and then I didn't need to worry about the x and y position onclick.