Recherche de superposition modale JS / JQuery ENTIÈREMENT

J’ai besoin d’une incrustation modale qui bloque les interactions avec le rest de la page et qui n’est PAS CLOSABLE par l’utilisateur, mais n’arrive pas à en trouver une pour laquelle je n’ai pas à remplacer les fonctionnalités existantes (comme supprimer le bouton X ou supprimer les fonction esc-to-close).

Quelqu’un connaît-il un plugin JQuery ou une autre bibliothèque JS capable de le faire? Plus petit + plus simple, mieux c’est …

En fait, c’est assez simple à écrire moi-même (couvrir toute la page avec un div transparent à 100%), mais c’est plus difficile à perfectionner (que se passe-t-il si l’utilisateur redimensionne la fenêtre? Et si on tabulait?) Donc, idéalement, j’utiliserais un plugin mais je déteste configurer des plugins pour mes besoins, car ils ne semblent jamais parfaits pour moi!

http://developer.yahoo.com/yui/examples/container/panel-loading.html

Heureusement, j’utilise déjà YUI, j’ai juste oublié cela. Exactement ce que je veux.

Je pense que simplement append une superposition div serait plus facile et nécessitait moins de code que d’utiliser n’importe quelle bibliothèque.

$('
').css({ top: 0, bottom: 0, left: 0, right: 0, position: absolute, zIndex: 1000 }).appendTo(document.body);

Vous pouvez le faire avec juste CSS avec un div superposé qui est absolument positionné en haut, à gauche, à droite, en bas par 0 de son conteneur, comme suit:

HTML

 

CSS

 .content { width:400px; height:400px; position:relative; z-index:1; } .overlay { opacity:0; filter: alpha(opacity = 0); position:absolute; top:0; bottom:0; left:0; right:0; display:block; z-index:2; background:transparent; } 

Démo http://jsfiddle.net/andresilich/WHEK3/4/