Toggle visibility of an HTML element
Snippet Menu
6
Tue. Feb. 28th, 2006 5:42 AM
Toggles the visibility of an HTML element. Should be part of everyone's javascript toolkit 
function toggleVis(obj)
{
var el = document.getElementById(obj);
if ( el.style.display != 'none' )
{
el.style.display = 'none';
}
else
{
el.style.display = '';
}
}
Tim Yates
Comments
Voting
Votes Up
Votes Down
(used in the same way)
var showRow = (navigator.appName.indexOf("Internet Explorer") != -1) ? "block" : "table-row";
function toggleVis(row) {
row.style.display = row.style.display=="none" ? showRow : "none";
}
function toggleVis(obj){
with(document.getElementById(obj).style){
if(display != 'none'){
display = 'none';
}else{
display = '';
}
}
}
<div id="toggled">Hi there!!!</div>
<a href="#" onclick="toggleVis('toggled');return false;">Toggle!</a>
So anyway, here's the good code.
<div id="toggled">Hi there!!!</div>
<a href="#" onclick="toggleVis('toggled');">Toggle!</a>
function toggleVis(obj) {
var el = document.getElementById(obj);
if ( el.style.display != 'none' )
{
el.style.display = 'none';
}
else
{
el.style.display = '';
}
}
Regards,
Kumar S
GuyFromChennai.com
Also, I noticed it appends the pound sign ("#") to the end of the URL when you click Toggle. Didn't someone come up with a better way to toggle visibility without doing that?
The "return false;" part will tell the browser not to follow the link.
-----------------------
http://jiart.org/
My digital playground with it's own sandbox.
Well anyway, I love programming
Just apply some CSS to make it look like a normal link.