Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10
  1. #1
    Regular Coder mOrloff's Avatar
    Join Date
    Nov 2008
    Location
    The Great Pacific NW, USA
    Posts
    422
    Thanks
    8
    Thanked 6 Times in 6 Posts

    Visibility control question from a COMPLETE noob.

    Every year or two, I want to do something SIMPLE via JS, and each time it's like i've never been there before

    I simply want a button to show/hide something on click, and I THINK I'm close, but it's not quite working.

    Here's what I'm toying with.
    Code:
    <html>
      <head>
        <script type="text/javascript">
          function showHide("idName") {
            if(document.getElementById("idName").style.visibility=="hidden") {
              document.getElementById("idName").style.visibility=="visible";
            }
            else {
              document.getElementById("idName").style.visibility=="hidden";
            }
          }
        </script>
      </head>
      <body>
        <button type="button" onclick="showHide(1)">Click Me!</button>
        <div id="1" "style=visibility:hidden;"><p>this is the stuff.</p></div>
      </body>
    </html>
    How do I get the button to make that div (in)visible??
    ~Mo
    Last edited by mOrloff; 08-16-2010 at 10:09 PM.

  • #2
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    Code:
        <div id="D1" style="visibility:hidden;"><p>this is the stuff.</p></div>
    Not a JS problem. An HTML problem. And don't use id's that start with digits.

    And then:
    Code:
    <html>
      <head>
        <script type="text/javascript">
          function showHide(id) {
            var div = document.getElementById(id);
            div.style.visibility = ( div.style.visiblity == "hidden") ? "visible" : "hidden";
          }
        </script>
      </head>
      <body>
        <button type="button" onclick="showHide('D1')">Click Me!</button>
        <div id="D1" style="visibility:hidden;"><p>this is the stuff.</p></div>
      </body>
    </html>
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,729
    Thanks
    202
    Thanked 2,507 Times in 2,485 Posts
    Do please read the posting guidelines regarding silly thread titles. The thread title is supposed to help people who have a similar problem in future. Yours is useless for this purpose. You can (and should) edit it to make it more meaningful.

    <div id="1" An id must start with a letter, not a number.

    "style=visibility:hidden;"> should be style="visibility:hidden">



    It is your responsibility to die() if necessary….. - PHP Manual

  • #4
    Regular Coder mOrloff's Avatar
    Join Date
    Nov 2008
    Location
    The Great Pacific NW, USA
    Posts
    422
    Thanks
    8
    Thanked 6 Times in 6 Posts

    Thanks to both of you.

  • #5
    Regular Coder mOrloff's Avatar
    Join Date
    Nov 2008
    Location
    The Great Pacific NW, USA
    Posts
    422
    Thanks
    8
    Thanked 6 Times in 6 Posts
    Pedant, is that tested code?
    I'm still coming up shy of the mark, even with a direct copy/paste of this code.
    Last edited by mOrloff; 08-16-2010 at 10:15 PM.

  • #6
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    Wasn't tested. Just fixed your obvious errors.

    And then made a typo:
    Code:
            div.style.visibility = ( div.style.visiblity == "hidden") ? "visible" : "hidden";
    put the missing "i" in there after the "b" and it will work.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #7
    Regular Coder mOrloff's Avatar
    Join Date
    Nov 2008
    Location
    The Great Pacific NW, USA
    Posts
    422
    Thanks
    8
    Thanked 6 Times in 6 Posts
    And ... for his next trick, he will walk and chew gum at the same time !!!

  • #8
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    17,729
    Thanks
    202
    Thanked 2,507 Times in 2,485 Posts
    Quote Originally Posted by mOrloff View Post
    And ... for his next trick, he will walk and chew gum at the same time !!!
    Nah, too difficult for an American who is below the rank of President.

  • #9
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,020
    Thanks
    75
    Thanked 4,323 Times in 4,289 Posts
    Philip: You don't seem to understand "rank" as applied to Americans: *EVERY* American thinks that they rank higher than President. They clearly think they know better than the President how the country should be run. So the President is at the bottom, with Senator just barely above him, and so on. <grin style="sad, but true" />
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #10
    Regular Coder mOrloff's Avatar
    Join Date
    Nov 2008
    Location
    The Great Pacific NW, USA
    Posts
    422
    Thanks
    8
    Thanked 6 Times in 6 Posts
    PHP Code:
    if($factAboutAmericans==TRUE && $sad==TRUE){
        echo 
    'I probably shouldn\'t be laughing at this.';
    }else{
        echo 
    'Denial isn\'t only a river in Egypt ;-)';



  •  

    Posting Permissions

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