0

http://www.ericmmartin.com/projects/simplemodal/

ページの下部に2つの例があり、アニメーションを開く方法と閉じる方法を示しています。

私はjqueryにかなり慣れていません。onOpenとonCloseの両方を宣言するにはどうすればよいですか?(私は一度に1つしか動作させることができませんでした。

jQuery(function ($) {
    $('a.basic').click(function (e) {
        e.preventDefault();
        $('#basic-modal-content').modal(
            {
                onClose: function (dialog)
                {
                    dialog.container.fadeOut('slow', function () {
                    });
                }
            }
        );
    });

});

あなたが提供できるどんな助けにも感謝します。

4

4 に答える 4

0

これを行う最も簡単な方法は、彼がここで提供する2つの例を組み合わせるだけです。

//アニメーションを開く

$("#sample").modal({onOpen: function (dialog) {
    dialog.overlay.fadeIn('slow', function () {
        dialog.data.hide();
        dialog.container.fadeIn('slow', function () {
            dialog.data.slideDown('slow');   
        });
    });
}});

//アニメーションを閉じる

$("#sample").modal({onClose: function (dialog) {
    dialog.data.fadeOut('slow', function () {
        dialog.container.hide('slow', function () {
            dialog.overlay.slideUp('slow', function () {
                $.modal.close();
            });
        });
    });
}});

//結合されたアニメーション

$("#sample").modal({onOpen: function (dialog) {
    dialog.overlay.fadeIn('slow', function () {
        dialog.data.hide();
        dialog.container.fadeIn('slow', function () {
            dialog.data.slideDown('slow');   
        });
    });
},
onClose: function (dialog) {
    dialog.data.fadeOut('slow', function () {
        dialog.container.hide('slow', function () {
            dialog.overlay.slideUp('slow', function () {
                $.modal.close();
            });
        });
    });
}});
于 2013-01-19T22:05:25.320 に答える
0

onOpenオブジェクトマッピングでオプションを定義する必要があります。

function myOpen(dialog){
    // Do something with the dialog
}
function myClose(dialog){
    // Do something else with the dialog
} 
$('#basic-modal-content').modal({ onOpen: myOpen, onClose: myClose });

または、投稿で行ったように、関数呼び出しでコールバックを宣言できます。

$('#basic-modal-content').modal({
    onOpen: function(){
        // Do something with the dialog
    },
    onClose: function(){
        // Do something else
    }
 });
于 2010-03-22T17:37:32.083 に答える
0

あなたの最新のコメントを読んだ後、私はryanulitに同意します。ただし、これがあなたが説明したことを達成するための1つの解決策です。あなたは連絡先と登録リンクのためにこのようなことをすることができます:

<a href="#">Contact</a>
<a href="#">Register</a>

あなたはこのようなことをすることができます:

$('a[href=#]').click(function(){
    // Will reference 'contact' or 'register'
    var modalType = $(this).text().toLowerCase();
    $('simplemodal-' + modalType).modal({ /* Options... */ });
});
于 2010-03-22T20:16:10.140 に答える
0

質問の1つに答えてください:

すべてのモーダルが使用するオプションを1回設定する場合は、次の方法で行うことができます。

$.modal.defaults.onClose = function (dialog) {
     // your code
     $.modal.close();
}
于 2010-03-23T03:09:07.300 に答える