Hide and Show Elements by Class or ID
9
There seems to be so many hide/show scripts out there, so here's the functions I wrote and use on a regular basis - there are 7 functions, hide, show and toggle by id or class - and the getElementByClass function that does not exist as a built in Javascript function...
This is in response to the flurry of visibility scripts that just don't have all the pieces needed to make them totally useful.
This is in response to the flurry of visibility scripts that just don't have all the pieces needed to make them totally useful.
// Scriptlets code written by Jeremy Edmiston
// The functions have been adapted from various sources
// and re-written to provide maximum flexibility
// and compatability with various browsers.
//Global Declarations
var ie = (document.all) ? true : false;
function toggleClass(objClass){
// This function will toggle obj visibility of an Element
// based on Element's Class
// Works with IE and Mozilla based browsers
if (getElementByClass(objClass).style.display=="none"){
showClass(objClass)
}else{
hideClass(objClass)
}
}
function hideClass(objClass){
// This function will hide Elements by object Class
// Works with IE and Mozilla based browsers
var elements = (ie) ? document.all : document.getElementsByTagName('*');
for (i=0; i<elements.length; i++){
if (elements[i].className==objClass){
elements[i].style.display="none"
}
}
}
function showClass(objClass){
// This function will show Elements by object Class
// Works with IE and Mozilla based browsers
var elements = (ie) ? document.all : document.getElementsByTagName('*');
for (i=0; i<elements.length; i++){
if (elements[i].className==objClass){
elements[i].style.display="block"
}
}
}
function toggleID(objID){
// This function will toggle obj visibility of an Element
// based on Element's ID
// Works with IE and Mozilla based browsers
var element = (ie) ? document.all(objID) : document.getElementById(objID);
if (element.style.display=="none"){
showID(objID)
}else{
hideID(objID)
}
}
function hideID(objID){
// This function will hide Elements by object ID
// Works with IE and Mozilla based browsers
var element = (ie) ? document.all(objID) : document.getElementById(objID);
element.style.display="none"
}
function showID(objID){
// This function will show Elements by object ID
// Works with IE and Mozilla based browsers
var element = (ie) ? document.all(objID) : document.getElementById(objID);
element.style.display="block"
}
function getElementByClass(objClass){
// This function is similar to 'getElementByID' since there
// is no inherent function to get an element by it's class
// Works with IE and Mozilla based browsers
var elements = (ie) ? document.all : document.getElementsByTagName('*');
for (i=0; i<elements.length; i++){
//alert(elements[i].className)
//alert(objClass)
if (elements[i].className==objClass){
return elements[i]
}
}
}






<a class="important fancy" href="http://www.google.ca">Google</a>
Regards,
Kumar S
GuyFromChennai.com