Accueil > Forum > > > > DIV position absolute fullscreen ?
DIV position absolute fullscreen ?
jeudi 30 août 2007 à 17:33:09 |
DIV position absolute fullscreen ?

guepard53
|
Salut à tous ! :-) J'aimerais griser le contenu d'une page quand j'affiche un div au dessus. Par exemple une image. J'ai déjà vu ça mais je ne retrouve plus d'exemple. (et en général on doit cliquer sur l'image ou sur le fond pour fermer le div et dégriser le fond) Sur firefox, j'arrive à faire ce que je veux mais (pour changer) ça ne fonctionne pas sur IE... Il ne prend pas le height = 100%... J'ai vu qu'en mettant le HTML et le BODY à 100% aussi, on pouvait réussir mais pas dans le cas d'un objet en position absolue... Donc question : Est-il possible de faire un DIV fullscreen qui soit positionné au-dessus de la page (en position absolue donc) ? Et sans passer par du javascript qui calculerait la taille de l'écran, on n'est jamais sûr que ça fonctionnera partout... (AvailHeight et compagnie, bof bof) Merci d'avance.
|
|
vendredi 31 août 2007 à 11:35:11 |
Re : DIV position absolute fullscreen ?

bultez
|
bonjour,
>>Sur firefox, j'arrive à faire ce que je veux c'est bien.
>>mais (pour changer) ça ne fonctionne pas sur IE... et à mon avis : ce sera comme d'habitude ! tu ne doit probablement pas faire ce qu'il faut, faire une erreur...
question on peut dire récurente... tu as cherché dans ce forum ? et sans le moindre bout d'extrait de ce que tu fais... difficile !
Cordialement Bul [mon Site] [M'écrire]
En général, c'est absurde de généraliser.
|
|
lundi 3 septembre 2007 à 11:37:28 |
Re : DIV position absolute fullscreen ?

guepard53
|
Hello bultez,
merci de ta réponse (même si je la trouve un poil ironique et dédaigneuse).
J'ai refait une page vierge pour bien isoler mon problème et voici ce que j'obtiens :
avec ce code, ça fonctionne sur IE et Firefox :
<html> <head>
<style>
body { margin: 0px; }
.fullScreen { position:absolute; left: 0px; top: 0px; background-color: black; width: 100%; height: 100%; filter: Alpha(Opacity=70); opacity: 0.5; }
</style>
</head> <body> CONTENT BEHIND DIV <div class="fullScreen"></div> </body> </html>
Par contre, si je place le div dans un tableau, cela ne fonctionne plus sous IE... Il prend en compte le background noir et la position absolue mais plus l'opacité ni les width et height. Je n'ai plus qu'un petit rectangle noir en haut à gauche de ma page. Voici le code :
<html> <head>
<style>
body { margin: 0px; }
.fullScreen { position:absolute; left: 0px; top: 0px; background-color: black; width: 100%; height: 100%; filter: Alpha(Opacity=70); opacity: 0.5; }
</style>
</head> <body>
<table> <tr> <td> CONTENT BEHIND DIV </td> </tr> <tr> <td> <div class="fullScreen"></div> </td> </tr> </table>
</body> </html>
Voilà, j'espère avoir été plus clair. :-)
Merci encore
|
|
lundi 3 septembre 2007 à 12:05:59 |
Re : DIV position absolute fullscreen ?

bultez
|
plutôt curieux de mettre ça dans un tableau ? non ? je ne vois pas pourquoi faire ? si le div doit affecter tout l'écran !
mais c'est vrai que, là aussi/encore, IE et FF se comportent de manière différente. hélas.
tu as essayé en mettant <table class="fullScreen"> ou <tr class="fullScreen> ou
<td class="fullScreen>
au lieu de le mettre dans le div ?
ce qui me semble plus logique (?) et là, ça baigne. (
si ça te convient, sinon il
va falloir trouver autre chose )
ou même : <div class="fullScreen"> </div>
>>même si je la trouve un poil ironique certes, jen conviens. on met très souvent IE en cause de manière injustifiée, très souvent il n'y est pour rien le pôvre, c'est l'utilisation qui en est faite qui pêche. de plus, ce n'est pas parce que FF et IE "gérent les choses autrement" que l'un a raison et l'autre tort. c'est une plaie, je suis d'accord.
>>et dédaigneuse ah, pas du tout. c'est toi qui le fut avec IE, qui, franchement, ne mérite pas ça. Je tiens à préciser, que je ne suis pas un "pro ie", comme on m'a déjà dit ! Pour être clair, ce n'est même pas mon navigateur par défaut. Je t'aurais dit la même chose si ta remarque ( comme d'habitude ça ne marche pas avec FF ) concernait FF.
|
|
lundi 3 septembre 2007 à 13:05:18 |
Re : DIV position absolute fullscreen ?

guepard53
|
Re,
pour l'utilisation d'un tableau, c'est un cas particulier dans le sens où il s'agit d'un portail dans lequel on place différents modules. Donc, pour le dev d'un module, je ne peux pas aller placer le div sur la page conteneur.
De même, je ne peux pas modifier les styles des tableaux conteneur...
Pas gagné on dirait. :-/
|
|
lundi 3 septembre 2007 à 13:09:12 |
Re : DIV position absolute fullscreen ?

guepard53
|
Et en rajoutant du contenu dans le div, ça réagit de la même manière.
|
|
lundi 3 septembre 2007 à 13:40:54 |
Re : DIV position absolute fullscreen ?

bultez
|
>>Pas gagné on dirait. :-/
effectivement, si tu n'es autorisé à toucher qu'au div et en le laissant là où il est ! ( pour IE, les 100% s'appliquent par rapport au td qui contient le div, ce qui n'est pas le cas de FF ) je ne sais pas si on peut "forcer" autrement en html,css en mettant la taille en fixe, width:1024px... [ houla ! :o) ] ou ( je te cite ) javascript qui calculerait la taille de l'écran ! ... peut-être d'autres pistes ?
Cordialement Bul [mon Site] [M'écrire]
En général, c'est absurde de généraliser.
|
|
lundi 3 septembre 2007 à 13:47:42 |
Re : DIV position absolute fullscreen ?

guepard53
|
Ouaip, j'vais essayer avec du javascript alors. Sinon ben j'me passerai de ce bel effet pour afficher les photos.  Merci bultez !
|
|
lundi 3 septembre 2007 à 13:51:25 |
Re : DIV position absolute fullscreen ?

guepard53
|
Sinon tu dis que le 100% s'applique par rapport au td qui contient le div, je pense en effet que c'est le cas sous IE mais comment expliques-tu qu'il n'applique plus la transparence ? 
|
|
lundi 3 septembre 2007 à 13:59:40 |
Re : DIV position absolute fullscreen ?

bultez
|
je n'explique rien du tout... si tu enlèves width et height : transparence ok. il reste de nombreuses choses qu'IE doit apprendre au niveau CSS ! et moi encore plus !! 
Cordialement Bul [mon Site] [M'écrire]
En général, c'est absurde de généraliser.
|
|
Cette discussion est classée dans : page, fullscreen, position, div, absolute
Répondre à ce message
Sujets en rapport avec ce message
Modification de tableau par balise div [ par gourango ]
Boujour et bien voila un grand probleme se pose la comptabilitee :J ai cree un script pour mon site malheureusement imcompatible avec ie !!!(internet
Position de DIV aléatoire [ par skullo ]
Bonjour à tous !Je ne sais pas si ce que j'aimerai faire est réalisable en html et css mais je demande quand même au cas où.Pour l'explication en déta
Récupérer la longueur d'une div et l'appliquer à une autre. [ par chiktika ]
Bonjour,Voila, J'ai un div (div id="contenu") dont la longueur dépend de la longueur d'un texte qui varie à chaque page html.J'ai un deuxième div (div
Position de la sourie sur une image [ par Gally ]
Bonjour a tous,J'ai une nouvelle petite question: Est-il possible de connaitre la position de la sourie sur une image ou meme sur un Div et cela en pi
Editeur de texte en ligne avec des objets dragables [ par calitom ]
Bonjour, Je cherche a faire une page permettant de regroupper plusieurs DIV draggables dans un DIV général. - En gros, il y aurait un DIV général. - E
ouverture page html dans une balise div avec xmlHttpRequest [ par romain_pil ]
pil_poilBonjour à tous,J'ai fais le choix d'utiliser une balise div plutot qu'une iframe pour afficher une page html dans une autre. J'utilise XmlHttp
deplacer des div avec la souris [ par reski_01 ]
bonjour a tous, j'ai chercher partout mais je ne trouve pas comment modifier ce que j'ai pu collecter je voudra
Un SEUL background [ par floflotz ]
bonjour à tous,je souhaite mettre une image en background sur mon site. Le problème est que quand j'applique la propriété background à mon body, il mu
Centrer un div [ par coyote ]
Je voudrais centrer un div (qui apparait) lors d'un clic souri. Le probleme est que je veux le centrer relativement au scroll de la page: la page aya
Cacher balise DIV [ par aloisio11 ]
Bonjour,J'utilise ce code pour cacher des parties () de ma page :document.getElementById('DivIcones').style.display='none';Il fonctionne avec
Livres en rapport
|
Derniers Blogs
[SHAREPOINT] LES SESSIONS TECHDAYS 2012.[SHAREPOINT] LES SESSIONS TECHDAYS 2012. par Patrick Guimonet
Voici donc pour ceux qui n'ont pas pu venir, ou ceux qui n'ont pas pu toutes les suivre la liste des sessions SharePoint aux TechDays 2012, que je mettrais à jour dès que les liens des vidéo seront disponibles. Ou ici : http...
Cliquez pour lire la suite de l'article par Patrick Guimonet TECHDAYS PARIS 2012 : SESSION PLEINIèRE JOUR 3TECHDAYS PARIS 2012 : SESSION PLEINIèRE JOUR 3 par ROMELARD Fabrice
Speaker: Bernard Ourghanlian Cette session est comme chaque jour transmise en live par BrainSonic, et j'ai donc suivi cette troisième pleinière par ce moyen sur mon iPad . Elle est dédiée comme chaque année à la mise en perspective de l'é...
Cliquez pour lire la suite de l'article par ROMELARD Fabrice MISHRA READER : UN LECTEUR RSS TRèS ZUNE STYLE EN OPEN SOURCE !MISHRA READER : UN LECTEUR RSS TRèS ZUNE STYLE EN OPEN SOURCE ! par Vko
Hier durant une session dédiée aux Techdays 2012, j'ai eu le plaisir d'annoncer la sortie de la Béta 2 de Mishra Reader. C'est quoi ? Pour les utilisateurs, c'est une vraie expérience de lecture de flux RSS sur Windows. Rien à voir avec les produit...
Cliquez pour lire la suite de l'article par Vko [FRAMEWORK 4] LES TASKS ET LE THREAD UI[FRAMEWORK 4] LES TASKS ET LE THREAD UI par fathi
Je viens de passer quelques temps au TechDay's et j'ai pu voir pas mal de session intéressante. Par contre une chose m'a un peu étonné lors de certaines de ces sessions qui abordaient les améliorations du framework .NET (donc le 4.5) : en gros, bea...
Cliquez pour lire la suite de l'article par fathi WORKFLOW FOUNDATION 3 A UN PIED DANS LA TOMBEWORKFLOW FOUNDATION 3 A UN PIED DANS LA TOMBE par JeremyJeanson
Depuis déjà un an, je conseille vivement les utilisateurs de Workflow Foundation 3 à migrer vers la version 4. L'information qui va suivre ne devrait donc pas trop prendre au dépourvu les personnes qui m'ont suivi. Je profite de ce poste, pour faire le re...
Cliquez pour lire la suite de l'article par JeremyJeanson
Logiciels
Academy System (17.2.1.0)ACADEMY SYSTEM (17.2.1.0)Logiciel de gestion des établissements.
- élèves/étudiants (inscription, dossier, absence...)
-... Cliquez pour télécharger Academy System Easy-Planning (1.0.0.1)EASY-PLANNING (1.0.0.1)Basé sur les mêmes principes que MyPlanning, Easy-Planning permet de créer des plannings sous la ... Cliquez pour télécharger Easy-Planning COLLECTOR PLUS (3.00B)COLLECTOR PLUS (3.00B)COLLECTOR PLUS version 3.00B est un logiciel utilisant une base de données alimentée par :
- L... Cliquez pour télécharger COLLECTOR PLUS PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V7.4)PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO (V7.4)PONAMEDIA TV DEVIENS HELLLOOO FLASH
LA TV SUR VOTRE ORDINATEUR.
Toute une plateforme Multi... Cliquez pour télécharger PONAMEDIA PREMIUM - HELLLOOO FLASH DEMO LettresFaciles 2011 (8.0.0.1)LETTRESFACILES 2011 (8.0.0.1)LettresFaciles est un logiciel facilitant la création et la rédaction de lettres types.
Son inte... Cliquez pour télécharger LettresFaciles 2011
|