jQuery-我的代码没有't似乎适用于所有浏览器

jQuery - My Code doesn't appear to work across all browsers

本文关键字:适用于 浏览器 代码 我的 jQuery-      更新时间:2023-09-26

我有这个代码:

function displayLoader( toggle ){
    if( toggle === 'show' ){
        $('.overlay, .loader').css({
            'z-index'       :   '1000',
            'display'       :   'inline'
        });
    } else {
        $('.overlay, .loader').css({
            'display':'none'
        });
    } 
}

这个的CSS是:

.overlay{
            clear: both;
            width: 100%;
            height:100%;
            z-index:600;
            position:absolute;
            background: url('../images/overlay.jpg');
            background-repeat: repeat;
            opacity:0.65;
            filter:alpha(opacity=65); /* For IE8 and earlier */
            display:none;
}
.loader{
    z-index:1000;
    position: absolute;
    display: none;
}

这是我的相关HTML代码:

<div class="overlay">
        <div id="horizon">
            <img src="../images/ajax-loader.gif" alt="Loading... Please wait." class="loader"/><br />
            <p class="loader">Loading... Please be patient.</p>
        </div>
</div>

当我调用displayLoader("显示")时,它工作得很好;(或隐藏)如果我正在使用FireFox,但一旦我尝试使用IE7+、Chrome或Safari,它就不会显示任何内容。

正如你可能看到的,我的CSS非常糟糕。

这方面的任何帮助都将是伟大的。

谢谢!

我做了一把小提琴。这对我来说似乎很好。我是不是错过了什么?

http://jsfiddle.net/3aLgY/4/