Thanks again for weighing in, Sam!

Your suggestion makes more sense, since it "degrades" better.

Cheers,
--Karl
_________________
Karl Swedberg
www.englishrules.com
www.learningjquery.com



On Feb 20, 2007, at 9:21 AM, Sam Collett wrote:

On 20/02/07, Karl Swedberg <[EMAIL PROTECTED]> wrote:
Ah yes, that's pretty straightforward.

One way to do this would be to put "Show/Hide" inside a <span> and
use the <a> for the actual link.

HTML:
<ul id="Menu">
   <li id="current_cat">
     <h3><span>Show/Hide</span <a
href="accessories.htm">Accessories></a></h3>
     <ul>
       <li> sub menu links</li>
       <li> sub menu links</li>
       <li> sub menu links</li>
       <li> sub menu links</li>
       <li> sub menu links</li>
     </ul>
   </li>
</ul>


jQuery:

$(document).ready(function() {
   $('#Menu ul').hide();
   $('#Menu h3 > span').click(function() {
     $(this).parent().next('ul').slideToggle('fast');
   });
});

If you want the <span> to be highlighted somehow on hover, see my
most recent tutorial:
http://www.learningjquery.com/2007/02/quick-tip-set-hover-class-for-
anything

Cheers,

--Karl
_________________
Karl Swedberg
www.englishrules.com
www.learningjquery.com

Or if you want it to make sense when JavaScript is off, remove the
span, and add it via jQuery:

$(document).ready(function() {
  $('#Menu ul').hide();
  $('#Menu h3').prepend("<a class='toggler' href='#'>Show / Hide</a>
").find("a.toggler").click(function() {
    $(this).parent().next('ul').slideToggle('fast');
    return false;
  });
});

A bit more code, but it will be styled as a link.




On Feb 20, 2007, at 2:31 AM, fatjoez wrote:


Hey.

Dont worry about my code ay.

All I'm basically asking is that in reference to the code pixel
carnage
provides as an example on his site, is it possible to modify this
so that on
the same Line as the Menu link which opens/closes a sub menu, is it
possible
also to add a LINK to an actual page also.

So that instead of it being like

[clikToToggleMenu]Menu1[/click]
sub menu link 1
sub menu link 2


INSTEAD to have it like this

[clikToToggleMenu]Show/Hide[/click]   [link]Menu1[/link]
sub menu link 1
sub menu link 2

Do you understand what I mean? So I want to have like a + / -
symbol to
expand collapse the menu and on the SAME line to have a link to
another
menu. Basically so I can show the link to the Parent category also!
--
View this message in context: http://www.nabble.com/collapsible-
menus-%7E-pixel-carnage-tf3256095.html#a9055526
Sent from the JQuery mailing list archive at Nabble.com.


_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/


_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/


_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/

_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/

Reply via email to