Question

我正在使用JQuery的时尚滑动菜单。

<script type="text/javascript">
        $(function(){
        $('ul.child').hide();
        $('ul.parent a.slide').click(function(){
        $('ul.child').slideUp('slow');
        $(this).next().find('a').show();
        $(this).next().slideDown('fast');
        return false;
        });
        });
        </script>

        <ul class="parent">
        <li>
        <a href="#" class="slide">Title One</a>
        <ul class="child">
        <li><a href="#">Link One</a></li>
        <li><a href="#">Link Two</a></li>
        <li><a href="#">Link Three</a></li>
        <li><a href="#">Link Four</a></li>
        <li><a href="#">Link Five</a></li>
        </ul>
        </li>
        </ul>

滑动菜单工作正常。但是在这个最后打开的'孩子ul'打开后不会关闭。我必须在一段时间后重置所有。任何想法？

Answer 1

请参阅：http://jsfiddle.net/fd46R/

 $(function(){
    $('ul.child').hide();
    $('ul.parent a.slide').click(function(){
    $('ul.child').slideUp('slow');
    $(this).next().find('a').show();
        if( $(this).next().is(':hidden') ) {
    $(this).next().slideDown('fast');
        }
    return false;
    });
    });

Answer 2

看到这是更新的代码，打开.child并等待1000毫秒（1秒），然后向上滑动。

<强> http://jsfiddle.net/fBYNy/3/

$(function() {
    $('ul.child').hide();
    $('ul.parent li').click(function() {
        $('ul.child',this).slideDown('slow').delay(1000).slideUp('fast');
    //                               -----^^^^^^^^^^---- this will slide 
    //                              the opened menu after 1 second of delay            
        $(this).next().children('.child').slideUp('fast');
        $(this).prev().children('.child').slideUp('fast');
        return false;
    });
});

时尚滑动菜单与JQuery

2 个答案: