Not signed in (Sign In)

SkillShare - A place to discuss Web Standards and Web Design topics

Categories

Vanilla 1.1.9 is a product of Lussumo. More Information: Documentation, Community Support.

    • CommentAuthorsjw
    • CommentTimeOct 29th 2007
     permalink
    Would anyone know how to modify the js below so that the smenu link both shows and hides the sub menu. I've tried searching google but all I found was french sites :-)

    window.onload=montre;
    function montre(id) {
    var d = document.getElementById(id);
    for (var i = 1; i<=10; i++) {
    if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
    }
    if (d) {d.style.display='block';}
    }

    <dl id="menu">
    <dt onclick="javascript:montre();"><a href="#">link</a></dt>
    <dd id="smenu2">
    <ul>
    <li><a href="#">link</a></li>
    <li><a href="#">link</a></li>
    <li><a href="#">link</a></li>
    <li><a href="#">link</a></li>
    </ul>
    </dd>
    <dt onclick="javascript:montre('smenu3');"><a href="#">link</a></dt>
    </dl>
    •  
      CommentAuthorJohnRiv
    • CommentTimeOct 30th 2007
     permalink
    It's best to throw out that entire script and start fresh with an unobtrusive javascript toggle script. A quick Google search brings up this example which explains the concept well: http://bonrouge.com/br.php?page=togglit
    • CommentAuthorsjw
    • CommentTimeOct 30th 2007
     permalink
    I think you're right. I spent a long time getting the menu to look the same cross browser only to find that it bounced around like a mexican bean in ie6. I discovered the fix to that was to remove height and use padding but that then produced more problems in ie6 and finally I gave up. That link seems pretty good. I will probably use it on another project but for now I'm using another menu format that works well cross browser and only has one small js problem to clear up :-)
    •  
      CommentAuthorcrash_D.
    • CommentTimeNov 3rd 2007 edited
     permalink
    use jquery for everything connected to dynamic html, dom, and html animation... its VERY easy to use and they hav great documentation... i first tried jquery, implemented in several hours, and now use it nearly every project... spend an hour or two for studying, but its worth it.. believe me.. you'll be grateful.. :)

    update: in jquery, the solution for your problem would look similar to this:
    $("a.hider").click (function () {
    $(this).next().toggle();
    })
    which means that, if any a class="hider" is clicked, the next same-level element in the DOM structure would hide (if visible) or show (if hidden)... there is a huge potential
Add your comments
    Username Password
  • Format comments as (Help)