[Ajax/Jquery] Z-index su loading-image

[robertino_salemi]

Salve a tutti,
sto utilizzando un semplicissimo script che mi permetta di visualizzare l'immagine di Loading su ogni chiamata Ajax.

Così ho scritto:
HTML:

<div id="loader">
               <div id="loading-image"></div>
</div>

CSS:

#loader
{
    display: none;
    background-image: url(../images/ajax-loader.gif);
    width:32px;
    height: 32px;
    position: fixed;
    text-align:center;
    z-index:9999;
    overflow: auto;
}
#loading-image {
  position: absolute;
  z-index: 99999;
}

AJAX:

$.ajax
    ({
        url: url,
    type: 'POST',
    data: {id: post},
    success: function(data) {
        jQuery("#result").html(data); 
},
        beforeSend: function () {
            $('#loader').show().css({ 'z-index': 99999 });
        },
        complete: function () {
            $('#loader').hide();
        }
    });

Funziona tutto bene, l'unico problema è lo z-index del div id="loader", viene settato automaticamente un z-index: -9999.

Come mai?

Avrei voluto usare JsFiddle, ma non ho saputo interpretare la chiama Ajax.
http://jsfiddle.net/ftG9V/1/

Grazie.

[robertino_salemi]

Risolto prima del previsto, scusatemi, c'è un altro JS con su Windows Ready al div id="loader" aggiungeva lo z-index a -9999.

Grazie!

[OoZic]

Potresti usare un approccio diverso (a me sembra più semplice), evitando beforeSend ma semplicemente prima di fare la chiamata mostrare il loading e toglierlo a chiamata riuscita, no?

suppongo quella chiamata sia associata a un azione dell'utente, probabilmente un click no?

[robertino_salemi]

Si cerco, al click su un SUBMIT presente in un form scatta la chiamata.

Scritto così funziona bene, il problema riguarda lo z-index.

[airon]

Scusa ma i valori della posizione dove sono?

top, left per dire...

E poi scusa perchè ti avvali di due div? Dei quali "loading-image" completamente inutile e con css dubbio?

[robertino_salemi]

Originariamente inviato da airon

Scusa ma i valori della posizione dove sono?

Hai ragione, per quello ho usato un JS che mi fissa il DIV a centro pagina secondo la risoluzione del monitor, ma soprattutto anche durante il resize.

[airon]

Ah ok!