Show/Hide Elements Question
Hello everyone,
I have been stuck on a JavaScript question and hoped someone here might have an answer.
Here is my situation:
I am currently designing a webpage that will have hide/show elements. The idea is to list names along the left-hand side, and when one clicks the name, to have the corresponding biographical information appear in a section to the right. I found code for this from an online tutorial.
The problem comes when I want to create a link on a separate webpage to a specific element. In other words, I would like to create a link elsewhere on the web that will load the webpage with the desired biographical information showing. I could not figure out a way to do this.
Does anyone have any suggestions for a way to create this kind of link? Or would there be better code to use for this purpose?
Thank you for your time! :)
I have been stuck on a JavaScript question and hoped someone here might have an answer.
Here is my situation:
I am currently designing a webpage that will have hide/show elements. The idea is to list names along the left-hand side, and when one clicks the name, to have the corresponding biographical information appear in a section to the right. I found code for this from an online tutorial.
<html>
<head>
<title>Quick One Page Information</title>
<script type="text/javascript">
var current = "1";
function pageSwitch(id){
if(!document.getElementById) return false;
var div = document.getElementById("page"+id);
var curDiv = document.getElementById("page"+current);
curDiv.style.display = "none";
div.style.display = "block";
current = id;
}
</script>
</head>
<body>
<!--layout-->
<div id="layout">
<!--navigation-->
<ul id="navigation">
<li><a href="#" onclick="pageSwitch(1); return false;">Page 1</a></li>
<li><a href="#" onclick="pageSwitch(2); return false;">Page 2</a></li>
<li><a href="#" onclick="pageSwitch(3); return false;">Page 3</a></li>
</ul>
<!--/navigation-->
<!--information-->
<div id="information">
<div id="page1">
<h2>Page 1</h2>
<p>This is some content for page 1. It's cool.</p>
</div>
<div id="page2">
<h2>Page 2</h2>
<p>This is some content for page 2. It's cooler.</p>
</div>
<div id="page3">
<h2>Page 3</h2>
<p>This is some content for page 3. It's coolest.</p>
</div>
<script type="text/javascript">
var divs = document.getElementById("information").g etElementsByTagName("div");
for(i = 0; i < divs.length; i++){
divs[i].style.display = "none";
}
document.getElementById("page1").style.d isplay = "block";
</script>
</div>
<!--/information-->
</div>
<!--/layout-->
</body>
</html>The problem comes when I want to create a link on a separate webpage to a specific element. In other words, I would like to create a link elsewhere on the web that will load the webpage with the desired biographical information showing. I could not figure out a way to do this.
Does anyone have any suggestions for a way to create this kind of link? Or would there be better code to use for this purpose?
Thank you for your time! :)
