1

我的网站中有一些具有相同元素的菜单，我想在 jQuery 中使用 slideDown 来仅向下滑动单击的菜单

但是现在当我单击一个菜单时，所有菜单都会向下滑动

HTML

        <div id="sidebar-right" >



                <div class="sidebar-menu">
                        <span class="sidebar-post">Last Posts</span>
                                <span class="sidebar-post-slide">+</span>

                               <div style="margin-top:-35px"></div>
                               <div class="sidebar-text">
Some content
                            </div>
                </div>
                <!-- S2 -->
                                <div class="sidebar-menu">
                        <span class="sidebar-post">Last Comments</span>
                                <span class="sidebar-post-slide">+</span>

                      <div class="sidebar-text">          
Some content
                        </div>
                </div>
                <!-- End S2 -->

         </div>

和 jQuery 方面

$(function() {
$('.sidebar-post-slide').click(function () {
if ( $('.sidebar-text').is( ":hidden" ) ) {
$('.sidebar-text').slideDown(800);
} else {
$('.sidebar-text').hide(800);
}
});
});
4

2 回答 2

1

您需要向下滑动兄弟sidebar-text元素，而不是所有sidebar-text元素

$(function() {
    $('.sidebar-post-slide').click(function () {
        //find the sibling sidebar-text element and complete any queued animations
        var $stext = $(this).siblings('.sidebar-text').stop(true, true);
        if ( $stext.is( ":hidden" ) ) {
            $stext.slideDown(800);
        } else {
            $stext.hide(800);
        }
    });
});

演示：小提琴

于 2013-10-22T02:22:23.437 回答
0

另一种选择是使用方法最接近（）。但在你的情况下，Arun 的 anwser 更好。

于 2013-10-22T02:24:44.540 回答