Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 2 of 2
  1. #1
    Junior Member
    Join Date
    Oct 2009
    Posts
    2
    Member #
    20062
    Hi, I'm new to all of this, I have about 2 days worth of experience. I'll try to keep this as short as possible. I have the following in said files:

    index.html
    Code:
    <img name="button" id="menu" src="n_button2.png" onclick="menuUp()" width="37" height="37" alt="button" />
    smenu.js
    Code:
    function menuUp()
    {
      document.getElementById("menu").src="n_button1.png";
      document.getElementById("stmenu").class="stmenu2";
    }
    This image does indeed change upon being clicked. So I figured I could use the same concept, as seen on the second line of the js file, to change a property. (reference below)

    [spoiler="more code"]
    index.html
    Code:
    <div id="stmenu" class="stmenu">
            <p class="links">
                <br />
                <a class="menulink" href="#">News</a><br />
                <a class="menulink" href="#">Info</a><br />
                <a class="menulink" href="#">Forum</a><br />
                <a class="menulink" href="#">Chat</a><br />
                <a class="menulink" href="#">Vent</a><br />
                <a class="menulink" href="#">Hardware</a><br />
                <a class="menulink" href="#">Software</a><br />
                <a class="menulink" href="#">Members</a><br />
                <a class="menulink" href="#">Pictures</a><br />
                <a class="menulink" href="#">Video</a><br />
                <a class="menulink" href="#">Contact</a><br />
                <br />
            </p>
        </div>
    style.css
    Code:
    div.stmenu
    {
        position:fixed;
        text-align:center;
        width:800px;
        right:-15px;
        left:1px;
        bottom:0px;
        margin-left:auto;
        margin-right:auto;
        display:none;
    }
    
    div.stmenu2
    {
        position:fixed;
        text-align:center;
        width:800px;
        right:-15px;
        left:1px;
        bottom:0px;
        margin-left:auto;
        margin-right:auto;
        display:inline;
    }
    smenu.js (as seen above)
    Code:
    function menuUp()
    {
      document.getElementById("menu").src="n_button1.png";
      document.getElementById("stmenu").class="stmenu2";
    }
    [/spoiler]

    My questions are,
    Why does the second line of code fail to change the hidden object to viewable?
    How can I unhide an object using the onclick as a trigger?

    Be advised that I may have completely missed a concept somewhere in all of this, so much explaining in your replies would be appreciated. Thanks in advance.

  2.  

  3. #2
    Junior Member
    Join Date
    Oct 2009
    Posts
    2
    Member #
    20062
    Not to bump my own thread so soon, however I have figured it out and wish to answer my own question to perhaps help someone else. The error was in my javascript. This is what ended up working:

    Code:
    function menuUp()
    {
      document.getElementById("menu").src="n_button1.png";
      document.getElementById("stmenu").className="stmenu2";
    }
    
    function menuOut()
    {
      document.getElementById("menu").src="n_button2.png";
      document.getElementById("stmenu").className="stmenu";
    }
    it was className="" , I used class="" . The joys of learning.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 12:14 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com