对于jQuery的blockUI的任何替代方案?

时间:2009-01-27 05:04:31

标签: jquery html css blockui

这个问题说明了一切! 我正在为jQuery 寻找一个易于使用的blockUI替代品。我已经尝试了几天在FireFox和IE中使用blockUI对话框,但没有机会。它不起作用。我查看了关于居中阻止blockUI对话框(How can I get a DIV to centre on a page using jQuery and blockUI?)的这个问题,但它只适用于Firefox。

5 个答案:

答案 0 :(得分:6)

您可能想要检查此插件调用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 :)'
});

Demo page

github

上的源代码

完整文档和用法请查看this post

或者如果你只是想集中一些DOM元素,你可以看看这个jQuery Center plugin

答案 1 :(得分:3)

对于对话框,我已从blockUI切换到Jquery UI。我认为这更好。

答案 2 :(得分:0)

这是我遇到并略微修改的扩展程序。现在看一下,我认为它实际上有点乱,可以使用清理(我认为有一些未使用的变量)

$.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();

答案 3 :(得分:0)

如果问题是由于加载维度插件和最新版本的jQuery引起的,那么Dimensions在几个版本之前被合并到核心并导致冲突。

答案 4 :(得分:0)

来自文档:

为什么我在Linux上看不到FF的叠加?

有几个人告诉我,FF / Linux中的整页不透明度渲染速度很慢,所以默认情况下它会在该平台上被禁用。您可以通过覆盖applyPlatformOpacityRules属性来启用它,如下所示:

// enable transparent overlay on FF/Linux 
$.blockUI.defaults.applyPlatformOpacityRules = false;