JS Layer Position Problem on Click

[Gretchen]

I have a form divided into virtual layers that are alternately visible and hidden. I move between layers using buttons according to the following code:

<input type="button" id="B1" value="Go Back" onClick="showLayer('page2')">
<input type="button" id="C2" value="Continue" onClick="showLayer('page3')">

When I click either button, it moves me to the correct layer, but always to the same position on the page as the cursor was last. In other words, if I was 550px down the page when I clicked "Continue," the next layer opens at 550px down the screen. As the content of some layers is only a few px high, you have to scroll up to see the content. This is fine for me as I know there is something on the page, but for a visitor to the form, they will think they clicked through to a blank page and shut down.

How do I get it to open at the top of the next layer?

The layers are created by <div> tags with "page" style defined by css as follows:

.page{
position: absolute;
top: 10;
left: 100;
visibility: hidden;

I tried adding hyperlinks (#name) between the buttons and the top of each page, but this has no effect.

Any ideas?!

[MichaelCL]

maybe you can use display: 'none' or 'block' instead. I don't recognise the symptoms you're talking about but in my experience the visibility property doesn't affect the layout, leaving large blank spaces...

[Gretchen]

I tried using display: 'none' and 'block.' Neither solves the problem. I am wondering if this script has any bearing:

<script type="text/javascript">
function MM_findObj(n, d) { //v4.01
var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length)
{
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);
}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}