I am very happy with jquery. And I have been playing around with it
over the last couple of days.
I am a designer with a heavy reliance on IDEs like dreamweaver. So my
coding background isn't strong, so please forgive this question if it
is too out of place to ask here.

I am using this code:
        <script>
        $(document).ready(function(){
                $("dd").hide();
                $("dt a").click(function(){
                        $("dd:visible").slideUp("fast");
                        $(this).parent().next().slideDown("fast");
                        return false;
                });
                        $(".parent a").click(function(){

                        $("dd:visible").slideUp("fast");

                        $(this).parent().next().slideDown("fast");
                        return false;
                });
        });
        </script>
        <style>
        body { font-family: Arial; font-size: 12px; }
        dl { width: 300px; }
        dl,dd { margin: 0; }
        dt { background: #CCC; font-size: 12px; padding: 5px; margin: 2px; }
        dt a { color: #FFF; }
        dd a { color: #000; }
        ul { list-style: none; padding: 5px; background: #CCC; font-size:
12px; padding: 5px; margin: 2px; }
        .parent {background: #CCC; font-size: 12px; padding: 5px; margin:
2px; }
        .parent a { color: #000; }
        .child {background: #ccc; font-size: 12px; padding: 5px; margin:
2px; }
        .child a { color: #fff; }
}
    </style>
</head>

<body>
<dl>
        <div class="parent" id="parent"><a href="http://www.google.com";
target="_blank">Home</a></div>
        <dt><a href="/">Company Profile</a></dt>
        <dd>
        <ul>
                <li><a href="/src/">Line1</a></li>
                <li><a href="/docs/">Line2</a></li>
                <li><a href="/blog/">Line3</a></li>

        </ul>
        </dd>
        <dt><a href="/discuss/">Our Business</a></dt>
        <dd>
        <ul>
                <li><a href="/discuss/">Line1</a></li>
                <li><a href="/tutorials/">Line2</a></li>
                <li><a href="/demos/">Line3</a></li>
                <li><a href="/plugins/">Line4</a></li>
        </ul>
        </dd>
        <dt><a href="/dev/">Our People</a></dt>
        <dd>
        <ul>
                <li><a href="/src/">Line1</a></li>
                <li><a href="/dev/bugs/">Line2</a></li>
                <li><a href="/dev/recent/">Line3</a></li>
        </ul>
        </dd>
</dl>

For a sliding menu. It work great, however I am am not sure how to
code in main "parent" sections with out any sub link "children" below
them. I'd like the childess parents to still show/hide as well as open
their links. There is probably a very simple way to do this. Thanks in
advance.

Reply via email to