ページでモーダル ダイアログを起動するプラグインがあります。boxPosition(el)関数を利用して中央に配置します。
function boxPosition(el) {
// calculate/set height of content area
var winH = $(window).height(), // viewport height
winW = $(window).width(), // viewport width
// position modal in center
var boxH = $('#myModal').outerHeight(true), // real modal height
bmcH = ttlH + auxH + cntH + ftrH + 80, // modal height plus content padding/margin
bmcW = $('#myModal').outerWidth(true), // real modal width
bmcT = (winH - (boxH < bmcH ? boxH : bmcH)) / 2, // top offset for centering
bmcL = (winW - bmcW) / 2; // left offset for centering
$('#myModal').css({ 'top': bmcT+'px', 'left': bmcL+'px' });
}
ページをロードするか、ページのサイズを変更すると、このプラグイン内で関数が呼び出されます。
boxPosition(el);
$(window).resize(function() {
boxPosition(el);
});
私はさらに2つの問題に対処しようとしています:
コンテンツが多く、スクロールできるページでも中央に配置したいと思います。私はこれを試しましたが、うまくいかないようです。
$(window).scroll(function () { boxPosition(el); });
モーダル内のクリックが登録されたときにその関数を呼び出したいと思います。