jquery - フェードインをスライドに変更

Question

私はメニュー構造を持っています:

<ul id="nav">
    <li id="button1" class="active"><a href="#page-1" title="creative">creativ</a><
    <li id="button1"><a href="#page-1" title="creative">creativ</a>
</ul>

.activeそして、クラスごとに背景画像を追加します:

#nav li.active a {
    cursor: default;
    background: url(images/nav-li-a_hover.png) no-repeat bottom center;
    padding-bottom: 5px;
}

クラスにfadeInエフェクトを追加しました。active

$('ul#nav li').click(function() {
    $(this).hide().addClass('.active').fadeIn(500);
});

でも今はスライド効果に変えたい。これどうやってするの？

Answer 1

有効なdomは、fadeInをslideDownに、fadeOutをslideUpに変更します。

<ul id="nav">
    <li class="button1 active"><a href="#page-1" title="creative">creativ</a></li>
    <li class="button1"><a href="#page-1" title="creative">creativ</a></li>
</ul>