Print Page | Close Window

Javascript visibility function

Printed From: Web Wiz Forums
Category: General Discussion
Forum Name: Web Design Discussion
Forum Description: Discussion on web design and development subjects.
URL: https://forums.webwiz.net/forum_posts.asp?TID=14572
Printed Date: 29 March 2026 at 3:06pm
Software Version: Web Wiz Forums 12.08 - https://www.webwizforums.com


Topic: Javascript visibility function
Posted By: ub3rl337ch3ch
Subject: Javascript visibility function
Date Posted: 06 April 2005 at 12:03am
I'm trying to set up a function to change the visibility of a named element. Here are two attempts below:
 
function Visibility(val) {
document.getElementById('val').style.visibility = "hidden";
}
 
function Visibility(val) {
var gt=getElementById(val);
document.gt.style.visibility = "hidden";
}
 
when i try to call the function using onclick="Visibilty(menu) (where menu is the id of a layer), it gives me and 'object expected' error.



Replies:
Posted By: Phat
Date Posted: 06 April 2005 at 12:32am
try

<script type="text/javascript">

function hide(DivID) {
document.getElementById(DivID).style.display = "none";
}

function show(DivID) {
document.getElementById(DivID).style.display = "inline";

}

</script>

with

onClick="show('DivID')" -- replace DivID witht the name of the element


Posted By: bootcom
Date Posted: 06 April 2005 at 7:05am
Nice, but you can do it all in one function, like so:
 

function hideShowElement(elID){
// If the element is currently not being shown then, show the
// element
if(document.getElementById(elID).style.display == "none"){
document.getElementById(elID).style.display = "";
return;
}
// Else if the element is being shown then hide it
document.getElementById(elID).style.display = "none";
return;
}
 
onClick="hideShowElement('DivID')"
 
It's a function I use a lot, but just to overstate the obvious here, using document.getElementById doesn't work on all browsers (include a document.all) for complete compatiability.
 
Easy enough function to modify. Have fun !


Posted By: ub3rl337ch3ch
Date Posted: 06 April 2005 at 7:09pm

It was obviously taking issue to the visibility property, becuase display worked fine. I ended up changing it around a bit to be:

 
function display(DivID,onoff){
if (onoff == "off"){
document.getElementById(DivID).style.display = "none";
}
if (onoff == "on"){
document.getElementById(DivID).style.display = "inline";
}
}
 
which works nicely with onclick="display('menu','off')" to turn menu off
 
is there a cross-platform function that does the same thing? or a function that i can physically put in my code that all platforms will register? more out of interest than need atm, because I'm working on this for a very small group of ie-users...


Posted By: ub3rl337ch3ch
Date Posted: 06 April 2005 at 8:35pm

'inline'  isn't working, and neither is '' turn the layer back on.

I get an 'object required' error. I was wondering if this has anything to do with the fact that the layers that i am trying to show are hidden when the page loads?


Posted By: Phat
Date Posted: 06 April 2005 at 10:02pm
I am not much of a javascripter but i would say you're trying to hide something by the wrong name. JS is also case sensitive.

I have a page which loads with hidden span tags which i can hide and show no problem.


Posted By: ub3rl337ch3ch
Date Posted: 06 April 2005 at 11:21pm
ok, i've finally got the thing working properly, except for Angry ONE Angry SINGLE Angry LAYER Angry which refuses to be shown...
 
my function:
 
function display(DivID,onoff){
if (onoff == "off"){
document.getElementById(DivID).style.visibility = 'hidden';
}
if (onoff == "on"){
document.getElementById(DivID).style.visibility = 'visible';
}
}
 
my call:
onclick="display('submissionlayer','on')"
 
my div:
id="submissonlayer"
 
the error:
Object required, line 45


Posted By: Phat
Date Posted: 06 April 2005 at 11:36pm
no idea may need to see the whole page. Got a link?


Posted By: ub3rl337ch3ch
Date Posted: 07 April 2005 at 12:44am
i can't show you the full page because its in the back end of a secure program... :p but here's the relevant stuff, and it still gives the same error:
 
www.accede.com.au/test.htm


Posted By: Phat
Date Posted: 07 April 2005 at 12:54am
http://members.iinet.net.au/%7Ephatkash/Javascripttest.htm - http://members.iinet.net.au/~phatkash/Javascripttest.htm

Make sure each element your calling is actually on the page. I also took out the form tag as your actually submiting the page sono need for it.


Posted By: ub3rl337ch3ch
Date Posted: 07 April 2005 at 1:08am
ok, NOW i feel like a tard... stupid typos... stupid reading too fast...
 
anyway, thanks... the form tags were there simply because i'd slapped the buttons in with fp, and it auto places a form...


Posted By: zMaestro
Date Posted: 17 April 2005 at 8:10pm
sorry, but is this code cross Browser, or just work with IE?


Posted By: bootcom
Date Posted: 17 April 2005 at 9:18pm
Will work on any of the browsers using document.getElementById zMaestro, I've just tested it on both Mozilla Firefox and NS6 and IE 6 and works fine (beauty of having multiple browsers for testing), mite not work with browsers like IE4 which don't accept document.getElementById though, although using document.all for those browsers should clear that up (saying that am not too sure whether all older browsers accept those CSS attributes).
 
Hope that helps dude Smile



Print Page | Close Window

Forum Software by Web Wiz Forums® version 12.08 - https://www.webwizforums.com
Copyright ©2001-2026 Web Wiz Ltd. - https://www.webwiz.net