Need help with javascript menu

Discussion in 'Web Design and Development' started by joecool85, Mar 19, 2006.

  1. joecool85 macrumors 65816

    joecool85

    Joined:
    Mar 9, 2005
    Location:
    Maine
    #1
    I got it to toggle back and forth, but I want it to be hidden when first loaded. Would that be a command like onLoad or something?

    Here is my code:

    <html>
    <head>
    <script type="text/javascript"></script>
    <title>Brother stuff</title>
    </head>
    <body>

    <div>

    <a href="javascript:toggle('menu1')">Menu</a><br>
    <h2 id="menu1">Contents</h2>

    <script type="text/javascript">
    document.getElementById('menul').style.listStyle="none";
    document.getElementById('tutorioli').style.display="none"; // collapse list
    document.getElementById('tutorialsli').style.display="none"; // collapse list
    function toggle(list){
    var listElementStyle=document.getElementById(list).style;
    if (listElementStyle.display=="none"){
    listElementStyle.display="block";
    }
    else{ listElementStyle.display="none";
    }
    } </script>
    </div>

    </body>
    </html>
     
  2. dornoforpyros macrumors 68040

    dornoforpyros

    Joined:
    Oct 19, 2004
    Location:
    Calgary, AB
    #2
    Try this, it's how I got the sliding panels to work on my site

     
  3. joecool85 thread starter macrumors 65816

    joecool85

    Joined:
    Mar 9, 2005
    Location:
    Maine
  4. dornoforpyros macrumors 68040

    dornoforpyros

    Joined:
    Oct 19, 2004
    Location:
    Calgary, AB
    #4
    doh! sorry! it was worth a shot!
     
  5. Coolnat2004 macrumors 6502

    Coolnat2004

    Joined:
    Jan 12, 2005
    #5
    I can't tell exactly what you're doing (I'm not a javascript expert by far..) but I know that you can create a function and have it run when the page loads like this:

    <body onload="myFunc();">

    I use this on pending.be to disable certain fields on load. This ensures that they aren't disabled by default for browsers that have javascript disabled.. But that's off-topic.
     
  6. joecool85 thread starter macrumors 65816

    joecool85

    Joined:
    Mar 9, 2005
    Location:
    Maine
    #6
    Got it to work:

    <html>
    <head>
    <script type="text/javascript"></script>
    <title>Brother stuff</title>
    </head>
    <body>


    <div>

    <a href="javascript:toggle('joe')">Joe</a><br>
    <h2 id="joe">This is my poem stuff.</h2>

    <a href="javascript:toggle('bad')">Bad</a><br>
    <h2 id="bad">This is my other stuff.</h2>

    <script type="text/javascript">
    document.getElementById('joe').style.display="none";
    document.getElementById('bad').style.display="none";

    function toggle(list){
    var listElementStyle=document.getElementById(list).style;
    if (listElementStyle.display=="none"){
    listElementStyle.display="block";
    }
    else{ listElementStyle.display="none";
    }
    } </script>
    </div>

    </body>
    </html>

    What it does is loads:

    Joe
    Bad

    Then you can click on each one and it pulls down stuff. Don't ask about the words in it, I was just getting the code right. I'll post the final project when I'm done. It's an expanding poem.
     

Share This Page