Comment créer un calque semi-transparent sur toute la page ?

  • Auteur de la discussion Auteur de la discussion Robinson
  • Date de début Date de début
WRInaute passionné
Bonjour,

Je cherche à créer un calque comme il en existe sur beaucoup de sites "pro" souvent utilisés pour afficher des photos.

Je sais créer un calque via <div style="z-index : 2;"> et y ajouter du contenu via ajax.

Cependant, je souhaiterai que ce calque soit composé d'un fond semi-transparent pour voir la page qui serait inaccessible sous celui-ci, et d'un cadre avec contenu html positionné à peu près au centre (ça pas de problème, je gère via top et left :P)

Ce cadre ne me pose pas de problème mais je ne sais pas comment faire pour rendre tout le reste de la page (autour du cadre) en semi-transparence.

J'ai bien pensé à utiliser une image semi-transparente (avec pleins de petits pixels noirs) comme fond pour la page mais ne suis pas certain que cela soit la bonne solution, de plus, je n'arrive pas à adapter le calque sur toute la largeur et hauteur de la page.

Si vous avez une solution simple, je suis preneur merci.
 
WRInaute passionné
Oui, j'utilise cela avec de bon résultats sous IE.

Mais à propos, y a t-il un moyen pour que la formule fonctionne aussi bien sur IE que Mozi !? Une idée Leonick ? Merci !
 
WRInaute passionné
J'ai réussi à faire ce que je souhaitais.
Cependant, j'ai un problème avec le calque sur la hauteur... quand la fenêtre a un menu déroulant, le calque ne s'arrête qu'à la partie visible.

Il existe une solution pour qu'il s'adapte automatiquement ? (100% ne fonctionne pas)
Merci.


Edit : visiblement, il faut calculer les dimensions de la page pour adapter le calque en pixels
Edit bis : c'est réglé, merci pour le lien webmasterlamogere, c'est exactement à ça que je pensais au début.
 
Discussions similaires
Haut