0

私はうまく機能する次のトグルを持っています。このすべてを理解していません。

jQuery(function() {
    jQuery('.toggle1').click(function() {
        jQuery('.toggle-box').slideToggle('fast');
        return false;
    });
});​

.toggle-boxボックスを切り替えて開いた後、入っているものがフェードインする可能性はありますか?

追加してみました..

jQuery(".toggle-box").fadeIn(2000);

しかし、運がありませんでした。

それはまったく可能ですか？

助けてくれてありがとう。

4

2 に答える 2

2

ここで役立つベスト プラクティスがいくつかありますが、一般的には、コンテナ (.toggle-boxInner と呼びます) のようなフェードイン() を使用します。

また、コードで発生する可能性のあるクリーンアップがいくつかありますが、いくつかのショートカットがあります

$(function(){ // when ready...

    // here's your onClick listener for the toggle1 class element(s)
    $('.toggle1').click(function(){ 

        // slideToggle the toggle-box
        $('.toggle-box').slideToggle('fast', function(){ 

            // this is called when the toggle-box slideToggle is complete
            $('.toggle-box .toggle-boxInner').fadeToggle('fast'); 
        });
        return false; // i don't think you should need this unless you're using
                      //    a <a/> or <input type='submit' /> 
                      //    as the .toggle1 element
    });
});

トグルボックスがスライドして戻ると消えるように、内部コンテナを .fadeToggle することができます。また、自由に .fadeIn('slow') を 'fast' に変更してください。

お役に立てれば！

編集：これらの提案された変更を行いました：P

于 2012-05-30T13:58:56.033 に答える
0 
$(function() {
    $('.toggle-box').hide().contents().hide();
    $('.toggle1').on('click', function(e) {
        e.preventDefault();
        $('.toggle-box').slideToggle('fast', function(e) {
            if ($(this).is(':visible')) {
                $(this).contents().fadeIn(2000);
            }else{
                $(this).contents().hide();
            }
        });
    }); 
});

フィドル

于 2012-05-30T14:31:50.993 に答える