# Swap CSS / .Js

**URL:** https://forum.kirupa.com/t/swap-css-js/182643
**Category:** web dev
**Created:** [March 20, 2006, 9:38am UTC](https://forum.kirupa.com/t/swap-css-js/182643 "2006-03-20T09:38:33Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![thedaveyb](https://avatars.discourse-cdn.com/v4/letter/t/4af34b/32.png) [@thedaveyb](https://forum.kirupa.com/u/thedaveyb)
#### Post date: [March 20, 2006, 9:38am UTC](https://forum.kirupa.com/t/swap-css-js/182643/1 "2006-03-20T09:38:33Z")

</div>

I think im looking for a swap CSS script that does a little more than the usual… if you visit this url

[http://www.workcomms.com/graduates/default.asp](http://www.workcomms.com/graduates/default.asp)

and use the submenu the inner page content changes, now to do this they are using seperate pages but i would like to do it with ID’d divs and then just swap’ which ever is needed…

i know there is a js script for onclick to show and hide but this then leaves the others open, the client is really fussy on the site being a fixed height so they all the unselected layers need to be hidden … and vice versa…

anyone?

current script i have is…

```
  [FONT=Arial][SIZE=2]&lt;script&gt;

```

function toggle( targetId ){  
if (document.getElementById){  
target = document.getElementById( targetId );  
if (target.style.display == “none”){  
target.style.display = “”;  
} else {  
target.style.display = “none”;  
}  
}  
}  
\</script\> [/SIZE][/FONT]

[FONT=Arial][SIZE=2]\<a href="#" onclick=“toggle(‘question’);return false;”\>Click here to see the hidden content\</a\> [/SIZE][/FONT]  
[FONT=Arial][SIZE=2] [/SIZE][/FONT][FONT=Arial][SIZE=2]  
\<div id=question style=“display:none”\>[/SIZE][/FONT]  
[FONT=Arial][SIZE=2]  
blah blah blah - put your content here![/SIZE][/FONT]  
[FONT=Arial][SIZE=2] [/SIZE][/FONT]  
[FONT=Arial][SIZE=2]\</div\>[/SIZE][/FONT]

and alternatives…  
[http://bontragerconnection.com/library/hide-reveal-examples/click-to-reveal.shtml](http://bontragerconnection.com/library/hide-reveal-examples/click-to-reveal.shtml)  
[http://demo.fairsky.us/javascript/reveal\_hide.html](http://http://demo.fairsky.us/javascript/reveal_hide.html)