define the id of a div

[ScottInTexas]

I am building the id of one of several divs in a function. To tie two objects together I have some cells with id's like 'cell1', 'cell2', etc. and some divs with IDs like popwin1, popwin2, etc. Onmouseover the function is called that strips off the word cell and replaces it with popwin.

onmouseover=parent.showme(event, this);

Now that I have the string how do I actually reference the div so I can change it's visibility?


function showMe(evt, which){
popX=20;
popY=evt.clientY + 2;
var re=/cell/i;
var str=which.id;
var popid=str.replace(re,"popwin");
popwin.id=popid;
popwin.style.left=popX+'px';
popwin.style.top=popY+'px';
popwin.style.visibility='visible';

}

[x_goose_x]

document.getElementById(popwin).style

[ScottInTexas]

Thanks Goose,

I still get an error on the page. Here is one of the several divs.

<div id='popwin1'>
<table class='popup'>
<thead><tr><th class='popuphdr' colspan='2'></th>
<th width='10%'><img src='/dwsurveyor/images/close.jpg' alt='close' onclick='parent.killme(this)' ></th></tr></thead>
<tbody><tr><td>inner html</td></tr></tbody>
</table>
</div>


I can check the javascript and it is creating the string popwin1 as desired. But the styles are not being changed, hence no pop up.

The style is defined in a CSS.

[scriptkeeper]

im not quite sure that this would work

obj=document.getElementById(which).style
popwin.obj.id=popid;
popwin.obj.left=popX+'px';
popwin.obj.top=popY+'px';
popwin.object.visibility='visible';

[cheesebagpipe]

It looks as if you generated the id - and then didn't use it.

function showMe(evt, which){
popX=20;
popY=evt.clientY + 2;
var re=/cell/i;
var str=which.id;
var popid=str.replace(re,"popwin");
var popwin = document.getElementById(popid);
popwin.style.left=popX+'px';
popwin.style.top=popY+'px';
popwin.style.visibility='visible';
}

[Mr J]

I notice that you have your function name including the capital M


function showMe(evt, which){


yet call the function with lowercase m


onmouseover=parent.showme(event, this);

This will throw up an error

Javascript is case sensitive


Here's what I have been messing with, sorry I couldn't understand the evt argument






<script>
function showMe(which){
popX=20;
popY=event.clientX + 200;
document.getElementById("popwin"+which).style.pixelLeft=popX
document.getElementById("popwin"+which).style.pixelTop=popY
document.getElementById("popwin"+which).style.visibility='visible';
}
</script>

<div id="cell1" style="width:100" onmouseover="showMe(1)">HI</div>
<div id="popwin1" style="position:absolute;width:100;visibility:hidden">Hello</div>

[ScottInTexas]

I know I am posting this long after everyone has offered their help, but since I have used the Goose's response I really haven't looked at this post.

The document.getElementById(popwin).style was the correct response and my error after that was something stupid that I have now forgotten.

I appreciate everyone's response. For the record, here's the final answer.

function showMenu(evt, which){
popX=40;
popY=evt.clientY + 2;
var popid="popwin" + which;
closeopendivs();
if (document.getElementById(popid)) {
document.getElementById(popid).style.left=popX+'px';
document.getElementById(popid).style.top=popY+'px';
document.getElementById(popid).style.visibility='visible';
}
}