www.webdeveloper.com
Results 1 to 4 of 4

Thread: [RESOLVED] Make a div visible/hidden

  1. #1
    Join Date
    Jan 2013
    Posts
    2

    resolved [RESOLVED] Make a div visible/hidden

    Why does'nt work this script?

    function ChangeVis(id) {
    if (document.getElementById(id).style.visibility="visible")
    {
    document.getElementById(id).style.visibility="hidden";
    }
    else if (document.getElementById(id).style.visibility="hidden")
    {
    document.getElementById(id).style.visibility="visible";
    }
    }

  2. #2
    Join Date
    Dec 2011
    Location
    Centurion, South Africa
    Posts
    779
    Hi,

    In your code you were doing assignments instead of comparisons. Using == or === will perform a comparison check.

    Code:
    function ChangeVis(id)
    {
    	if (document.getElementById(id).style.visibility === "visible") {
    		document.getElementById(id).style.visibility = "hidden";
    	} else
    	if (document.getElementById(id).style.visibility === "hidden") {
    		document.getElementById(id).style.visibility = "visible";
    	}
    }
    Another way it could be done is like so:

    Code:
    function ChangeVis(id)
    {
    	var e = document.getElementById(id);
    	e.style.visibility = (e.style.visibility === 'hidden') ? 'visible' : 'hidden';
    }
    JavaScript: Learn | Validate | Compact

  3. #3
    Join Date
    Aug 2008
    Location
    Sweden
    Posts
    227
    Using === to compare the types is not really needed here. Just use ==
    New to web development or in need of a good reference? Check out the Mozilla Developer Network or W3Schools.

  4. #4
    Join Date
    Jan 2013
    Posts
    2
    Thank you both for the useful advise.
    You were right, I had to use == instead of =.
    Really thank you.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles