Help with javascript toggle

Discussion in 'HTML & Website Design' started by ian_batten, Mar 12, 2008.

0
  1. #1
    Hi guys,
    I'm using the following script to toggle a menu/div:

    <script type="text/javascript">
<!--
    function toggle_visibility(id) {
       var e = document.getElementById(id);
       if(e.style.display == 'block')
          e.style.display = 'none';
       else
          e.style.display = 'block';
    }
//-->
</script>
    Code (markup):
    <div id="foo"><a href="#" onclick="toggle_visibility('foo');">Test</a></div>
    Code (markup):

    However, currently it is automatically set to show, and then close when you click on it. How can I enable it so it's default set to hide, and on click, it shows the div?

    Also, it seems to require one click on the link before it kicks into action, how can I overcome this?

    If these issues can be fixed with this script that will be great, but if you have any alternative scripts, I guess they would be okay.

    Thanks in advance!
     
    ian_batten, Mar 12, 2008 IP
  2. TDD-Designs

    TDD-Designs Peon

    Messages:
    98
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #2
    <body onLoad="toggle_visibility('foo')">
     
    TDD-Designs, Mar 12, 2008 IP
  3. ian_batten

    ian_batten Well-Known Member

    Messages:
    1,991
    Likes Received:
    106
    Best Answers:
    0
    Trophy Points:
    185
    #3
    Hmm,, that doesn't seem to make a difference. The div still loads when the page is shown, rather than starting off hidden.
     
    ian_batten, Mar 13, 2008 IP