Hi All,
I have found a script to toggle layers. However, I need the script to hide 3 layers and show 1 layer when a button is clicked. I have the following code:
<div class=”info”>
<h4>About</h4>
<p>
<a href=”javascript:toggleLayer(‘details’);”>+Philosophy</a>
<br /><br />
</p>
<h4>Jobs</h4>
<p>
<a href=”javascript:toggleLayer(‘job1’);”>+3D artist</a>
<a href=”javascript:toggleLayer(‘job2’);”>+Architectural modeller</a>
<a href=”javascript:toggleLayer(‘job3’);”>+Information</a>
</p>
</div>
<div class=”info”>
<div id=”details”>
<h4>Details</h4>
<p>
We are passionate about Architecture + Design and take pride in creating
material to communicate the ideas which shape the landscape around us.
</p>
<p>
The digital medium provides many opportunities to express creativity and
develop an invaluable set of skills where anything is possible and can be
realised in all its glory.
</p>
<p>
We believe we should take advantage of this to constantly push the boundaries
of how we interact with and present these ideas.
</p>
</div>
<div id=”job1″>
<h4>Architectural Modeller</h4>
<p>
Must be skilled with 3D max with 2+yrs industry experience. Good knowledge
of rendering with VRay & Mental Ray. Combustion and After Effects an
advantage.
<br />
Architectural training required.
</p>
<p>
<a href=”mailto:[email protected]”>Apply to [email][email protected][/email]</a>
</p>
</div>
<div id=”job2″>
<h4>3D Artist</h4>
<p>
Must be skilled with 3D max with 1-2yrs industry experience. A good
understanding of how to read architectural drawings and construction details.
<br />
Architectural training required.
</p>
<p>
<a href=”mailto:[email protected]”>Apply to [email][email protected][/email]</a>
</p>
</div>
<div id=”job3″>
<h4>Information</h4>
<p>
We are permanently on the lookout for telented people to join our team. We are
a small company with big ideas and are looking to expand. This is a great
opportunity to be art of a friendly and exciting company. We are located in
excellent offices near to the train station in Huddersfield, Manchester and
Leeds are a stones throw away.
</p>
<p>
If you have a flair for creating aspirational and beautiful imagery then you
should contact us with some samples of your work.
</p>
</div>
</div>
<div class=”clear”></div>
</div>
<!– END INFO –>
<img src=”images/buttons/the_end.jpg” alt=”the end” />
<script type=”text/javascript”>
function toggleLayer(whichLayer)
{
if (document.getElementById)
{
// this is the way the standards work
var style2 = document.getElementById(whichLayer).style;
if (whichLayer==’details’)
{
style2.display = style2.display? “”:”block”;
}
else if (whichLayer==’job1′)
{
style2.display = style2.display? “”:”block”;
}
else if (whichLayer==’job2′)
{
style2.display = style2.display? “”:”block”;
}
else if (whichLayer==’job3′)
{
style2.display = style2.display? “”:”block”;
}
}
else if (document.all)
{
// this is the way old msie versions work
var style2 = document.all[whichLayer].style;
if (style2==details)
{
style2.display = style2.display? “”:”block”;
}
}
else if (document.layers)
{
// this is the way nn4 works
var style2 = document.layers[whichLayer].style;
if (style2==details)
{
style2.display = style2.display? “”:”block”;
}
}
}
</script>
Basically, the current script toggles the four layers on and off. What I need it to do is when one of the buttons is clicked, to turn on that layer and turn off the remaining three.
The webpage can be seen at [url]www.id30.com/pikcells
Any help anybody can provide would be much appreciated.
Many thanks
David