[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]

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! :)