4

バックグラウンド:

やや意外な問題に遭遇しました。.slideToggle()要素の表示/非表示に使用している小さなjQueryモジュールがあり、正常に機能しています。今日、プラグインに2つのパブリックメソッドを実装して、スライド効果で要素を表示または非表示にします。

単純に聞こえますが、私は同じことを実行するために使用.slideUp()slideDown()ます。要素でこれらのメソッドを呼び出しても何も起こらないことに気付いたとき、私は本当に驚きました。

ちなみに、呼び出し.show().hide()同様に正常に機能しますが、コース外の目的のアニメーションはありません。

私はいつもそれが「内部」と.slideToggle()同じ機能を実装していると思っていましたが、どうやらそうではないようです。.slideUp().slideDown()

私の質問:

あるものを他のものと比較して使用する場合、どのように.slideToggle()違い、.slideUp()そして何を考慮しなければなりませんか?.slideDown()

更新、例:

私はそれをこのフィドルでこのエラーを再現するために必要な最も重要なコンポーネントに分解することができました。コメントアウトして.slideToggle("slow").slideUp("slow")それぞれテストすることができます。slideToggleでは機能しますが、slideUpでは機能しません。

4

2 に答える 2

4

問題は、それslideUpがメソッドの最良の名前ではないということです。より適切な名前は「slideHide」です。これに変更するとslideDown、showに対応するため、期待どおりに機能します。

http://api.jquery.com/slideUp/から

説明:スライドモーションで一致した要素を非表示にします。

于 2012-12-04T14:30:35.987 に答える
1

実際、同じように機能します。slideDownとの呼び出し順序が逆になっていると思いますslideUp。これが更新されたフィドルです。

コード:

var flip = true;
$(".dockedHeader").on("click", function () {
    if (flip) {
        $(".content").slideDown("slow");
        flip = !flip;
    } else {
        $(".content").slideUp("slow");
        flip = !flip;
    }
    //$(".content").slideToggle("slow");
});

最初はコンテンツが非表示になっているため、表示するsliderDown()代わりに電話をかける必要がslideUp()あります。その逆も同様です。

于 2012-12-04T14:32:38.693 に答える