Hey all..
I've got a little problem on my hands. I've been working on my website and I am creating a portfolio page. Now I've created this nifty space saver that makes the website look more sleek and simple. The idea is when a visitor clicks on one of the thumbnails of any of the websites I've made they get a text description about the website. The problem is that when I click on two different links I get two different texts. I want it to only show text for one of the links at a time. So if I click Hidden 1, only hidden 1 shows and when I click Hidden 2 it hides Hidden 1 and shows Hidden 2 only and vica versa. Here's my code:
Code:
<html>
<head>
<script language="javascript">
<!--
var state = 'hidden';
function showhide(layer_ref) {
if (state == 'visible') {
state = 'hidden';
}
else {
state = 'visible';
}
if (document.all) { //IS IE 4 or 5 (or 6 beta)
eval( "document.all." + layer_ref + ".style.visibility = state");
}
if (document.layers) { //IS NETSCAPE 4 or below
document.layers[layer_ref].visibility = state;
}
if (document.getElementById && !document.all) {
maxwell_smart = document.getElementById(layer_ref);
maxwell_smart.style.visibility = state;
}
}
//-->
</script>
</head>
<body>
<!-- HIDDEN 1 INFORMATION TO BE SHOWN ONCLICK -->
<div id="hidden1" style="visibility:hidden">
Hidden 1 text!!!! </div>
<!-- END - HIDDEN 1 INFORMATION TO BE SHOWN ONCLICK -->
<a href="javascript://" onclick="showhide('hidden1');">Hidden 1</a>
<!-- HIDDEN 2 INFORMATION TO BE SHOWN ONCLICK -->
<div id="hidden2" style="visibility:hidden">
Hidden 2 text!!!!
</div>
<!-- END - HIDDEN INFORMATION TO BE SHOWN ONCLICK -->
<a href="javascript://" onclick="showhide('hidden2');">Hidden 2</a>
</body>
</html>
Hope you guys can help. Thanks...