Bootstrap modal垂直中央

ネット上でBootstrap 2のModal dialogが垂直に中央に位置する問題の解決方法を見て、この方法は自分で試してみたが、完全に中央に位置することができず、ウィンドウの大きさが異なると、表示されるたびにmargin-top値も変化し、カバー層にはスクロールバーが現れ、効果もよくない.コードは以下の通りである.

//            
$('#YourModal').modal().css({
    'margin-top': function () {
        return -($(this).height() / 2);
    }
});

//                   ：
$('.modal').on('show', function() {
    $(this).css({
        'margin-top': function () {
            return -($(this).height() / 2);
        }
    });
});

今日はちょうどこの問題に遭遇しましたが、私が使っているBootstrapフレームワークはBootstrap 3バージョンで、解決コードは以下の通りです.

$('#YourModal').on('show.bs.modal', function (e) {
    $(this).find('.modal-dialog').css({
        'margin-top': function () {
            var modalHeight = $('#yourModal').find('.modal-dialog').height();
            return ($(window).height() / 2 - (modalHeight / 2));
        }
    });    
});