views:

60

answers:

1

I am making a nested ul slide down when it's parent is clicked on for a clients navigation, so the parent link is deactivated with return false. But the return false is deactivating the child links too, how can I avoid this?

$("li.page_item a:first-child").click(function() {

    //select it's direct sub ul
    var subnav = $(this).next();
    //other subnavs
    var navsibling = $(this).parent().siblings('li').children('ul');

    //hide siblings subnav
    if (navsibling.is(":open")) {
        navsibling.slideUp("slow");
    }

    // check to see if sub is hidden, open if it is, close if it isn't
    if (subnav.is(":hidden")) {
        subnav.slideDown("slow");
    } else {
        subnav.slideUp("slow");
    }       

    // stop the top level link from linking
    return false;       

});

I thought using a:first-child would only apply the return false to that specific a and not any of it's sibling's children... suggestions?

Edit: It is a list pages widget in wordpress, basically the markup is this:

<ul> 
    <li class="page_item"><a href="">Link</a> 
        <ul> 
            <li><a href="">SubLink</a></li> 
            <li><a href="">SubLink</a></li> 
            <li><a href="">SubLink</a></li>
            <li><a href="">SubLink</a></li> 
        </ul> 
    </li> 
    <li class="page_item"><a href="">Link</a> 
        <ul> 
            <li><a href="">SubLink</a></li> 
            <li><a href="">SubLink</a></li> 
            <li><a href="">SubLink</a></li>
            <li><a href="">SubLink</a></li> 
        </ul> 
    </li> 
</ul>
+1  A: 

try

$("li.page_item").children("a:first-child").click(function() {
Funky Dude
Or equivalently, `$('li.page_item > a:first-child')`
K Prime