-1

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」では、開いた後に閉じません。しばらくしてからすべてをリセットする必要があります。何か考えはありますか?

4

2 に答える 2

2

これを参照してください：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;
    });
    });​
于 2012-12-06T07:32:18.687 に答える
0

これは、.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;
    });
});
于 2012-12-06T07:11:00.697 に答える