Come aggiungere un DIV di sovrapposizione per coprire un DIV esistente (utilizzando JQuery)?

Question

Ho un DIV 'contenitore' che può avere tutti i possibili stili CSS come: margine, riempimento, bordo e posizione diversa (fissa, relativa, assoluta).

Voglio mostrare un'icona di caricamento sopra il DIV "contenitore" e vietare all'utente di utilizzare qualsiasi controllo nel DIV "contenitore".

<div class="container"> 
A lot of content here ... 
</div> 

Come posso aggiungere un DIV sovrapposizione (utilizzando jQuery), che copre l'intera area visibile DIV 'contenitore' (zona di margine non deve essere coperto)?

Con i migliori saluti, Zach

Answer 1

Se nulla per cambiare in CSS, quindi:

$("<div />").css({ 
    position: "absolute", 
    width: "100%", 
    height: "100%", 
    left: 0, 
    top: 0, 
    zIndex: 1000000, // to be on the safe side 
    background: "url(/img/loading.gif) no-repeat 50% 50%" 
}).appendTo($(".container").css("position", "relative")); 

DEMO:http://jsfiddle.net/jKfTC/