I have a page which uses a hidden div, that can be made visible using a link. This then displays various information which can be changed using links within it.

But each time I click a link on the page, the div dissappears again!

here is the code in the a tag that Im using:

<a onclick="javascript:Show('overlay');" href="index.php?workId=1#img">Apollyon</a></li><li><a onclick="javascript:Show('overlay');" href="index.php?workId=2#img">jaadoo</a>

Is this code correct or am I missing something?

You are just showing us the function call. It's useless, we need to see the complete function(s) to help you

oh! here is the code for the function

function hide(str) {
x = document.getElementById(str);
x.style.visibility = 'hidden';
}
function Show(str) {
x = document.getElementById(str);
x.style.visibility = 'visible';
}

Ok

soooo!

You click a link to show an element and with the same click reopen the page, what would be your guess at the problem?

Yeah I know thats the problem, but do you know if theres a relatively easy solution to fixing it? Or would it be easier to just use a completely different method that doesn't involve a hidden div?

each time you open the page call the show() function.

Though to cover for UAs that have no javascript capabilities, the best way is to open the page with all hidden elements shown, then use a javascript call to hide them all, and show the default with an onload event.

Thanks I'll keep that in mind