質問はそれをすべて言います!jQuery用のblockUIの使いやすい代替手段を探しています。私はFireFoxとIEの両方でblockUIを使用してダイアログボックスを中央に配置しようと何日も試みてきましたが、チャンスはありません。動作しません。blockUIダイアログボックスの中央揃えに関するこの質問を見ましたが(jQueryとblockUIを使用してDIVをページの中央揃えにするにはどうすればよいですか?)、Firefoxでのみ機能します。
5 に答える
このプラグイン呼び出しjQuery MSGを確認することをお勧めします。ie6を含むほとんどのブラウザでうまく機能します。また、非常に軽量で、コード コメント付きで非圧縮の 4k のみです。
サンプルコード
// this will block the page and shows a `please wait` message
$.msg();
// you can change the content by the following code
$.msg({
content : '<img src="loading.gif"/> Sending mail :)'
});
githubのソースコード
完全なドキュメントと使用法は、この投稿を確認してください
または、DOM 要素を一元化したいだけの場合は、このjQuery Center プラグインをご覧ください。
ダイアログ ボックスについては、 blockUI からJquery UIに切り替えました。私はそれが良いと思います。
これが私が出くわして少し変更した拡張機能です。今それを見ると、実際には少し厄介で、クリーンアップを使用できると思います(未使用の変数がいくつかあると思います)
$.fn.vCenter = function(options) {
var pos = {
sTop : function() {
return window.pageYOffset || $.boxModel && document.documentElement.scrollTop || document.body.scrollTop;
},
wHeight : function() {
if ($.browser.opera || ($.browser.safari && parseInt($.browser.version) > 520)) {
return window.innerHeight - (($ (document).height() > window.innerHeight) ? getScrollbarWidth() : 0);
} else if ($.browser.safari) {
return window.innerHeight;
} else {
return $.boxModel && document.documentElement.clientHeight || document.body.clientHeight;
}
}
};
return this.each(function(index) {
if (index == 0) {
var $this = $(this),
$w = $(window),
topPos = ($w.height() - $this.height()) / 2 + $w.scrollTop()
;
if (topPos < 0 && (options == undefined || !options.allowNegative)) topPos = 0;
$this.css({
position: 'absolute',
marginTop: '0',
top: topPos //pos.sTop() + (pos.wHeight() / 2) - (elHeight / 2)
});
}
});
};
$.fn.hCenter = function(options) {
return this.each(function(index) {
if (index == 0) {
var $this = $(this),
$d = $(document),
leftPos = ($d.width() - $this.width()) / 2 + $d.scrollLeft()
;
if (leftPos < 0 && (options == undefined || !options.allowNegative)) leftPos = 0;
$this.css({
position: "absolute",
left: leftPos
});
}
});
};
$.fn.hvCenter = function(options) {
return this.vCenter(options).hCenter(options);
};
使用法:
$('#verticalCenter').vCenter();
$('#horizontalCenter').hCenter();
$('#bothCentered').hvCenter();
ドキュメントから:
Linux の FF でオーバーレイが表示されないのはなぜですか?
何人かの人々が、FF/Linux でのページ全体の不透明度のレンダリングが非常に遅いと私に知らせてきました。そのため、そのプラットフォームではデフォルトで無効になっています。次のように applyPlatformOpacityRules プロパティをオーバーライドすることで有効にできます。
// enable transparent overlay on FF/Linux
$.blockUI.defaults.applyPlatformOpacityRules = false;
ディメンション プラグインを最新バージョンの jQuery と共にロードすることによって問題が発生した場合、ディメンションは数バージョン前にコアにマージされ、競合を引き起こしていました。