I have been using a small snippet of my html design that uses css and javascript to toggle the display of content that is under it. I use it to toggle the source code, the output, etc. I am putting the html code under the toggle below, check it out and feel free use it.
View Html CodeHide Html Code<span id="vid"
style="text-decoration:underline;display:inline;cursor:pointer;color:blue;"
onclick="this.style.display='none';document.getElementById('hid').style.display='inline';
document.getElementById('sid').style.display='block';">
<b>View Html Code</b></span>
<span id="hid" style="text-decoration:underline;display:none;cursor:pointer;color:blue;"
onclick="this.style.display='none';document.getElementById('vid').style.display='inline';
document.getElementById('sid').style.display='none';">
<b>Hide Html Code</b></span>
<div id="sid" style="display: none;"><pre>
Here goes my content[ NOTE: Please take care keep the id (vid,hid,sid) unique ]
</pre></div>
# posted by Prasad.A : 9:46 PM
