Présentation genre powerpoint avec css

Bonjour,

Je souhaiterais développer un site au boulot qui me serve également de base de présentation (par videoprojecteur notamment) du genre powerpoint. Ci-joint une image présentant le cadre que je souhaiterais pour ce site. Pour l'image du haut c facile , on met un background en fixed en haut a gauche fait avec une regle du genre :

body {
color:black;
background-color:white;
background-image:url(images/background3.jpg);
background-repeat:no-repeat;
background-attachment:fixed;
margin:0;
text-align:left;
font-family: Arial, Helvetica, Arial Black, Wide Latin, sans-serif;
}

Le problème que j'ai est concernant l'image en bas à droite. Je voudrais que quelquesoit la taille du contenu et le navigateur (cible ie6et+ et firefox2et+) cette image soit fixé au navigateur en bas a gauche independamment du scroll. Or avec ce genre de regle :

div#bg {
background-image:url(images/footer3.jpg);
background-repeat : no-repeat;
background-attachment: fixed;
background-position:bottom right;
}

cela ne marche que sous firefox et encore, uniquement si la taille de la page prend toute la hauteur du navigateur

Quelqu'un a t'il déjà essayé de faire un site de ce genre et aurait une idée de la façon dont je dois procéder.

Merci par avance,
Realworld

Bonjour et bienvenue realworld,

realworld a écrit :
Quelqu'un a t'il déjà essayé de faire un site de ce genre et aurait une idée de la façon dont je dois procéder.

Oui E. Meyer avec S5 et D. Glazman avec l'extension Fuller Screen (de mémoire)
Et Adobe avec un PDF en plein écran

realworld a écrit :
cela ne marche que sous firefox et encore, uniquement si la taille de la page prend toute la hauteur du navigateur

Ah si ce n'est pas pour ton seul usage en tant que conférencier mais aussi pour les retardataires avec IE6, ce point de FAQ: Comment coller un élément (pied de page) en bas de page, quel que soit le contenu ? et les articles d'Openweb sur le positionnement te seront d'une grande aide je pense

Bonjour,

Un outil que j'utilise régulièrement, celui du w3c: Slidy. Voir également Opera Show.

R'hello,

Merci à tous pour vos réponses. En fait j'ai trouvé les solutions suivantes (a peu près satisfaisantes) :

* sous firefox : je met l'image fixe en bas à droite en background du body du style :

body {
color:black;
background-image:url(images/footer3.jpg);
background-repeat : no-repeat;
background-attachment: fixed;
background-position:bottom right;
margin:0;
text-align:left;
font-family: Helvetica, Arial Black, Wide Latin, sans-serif;
}

Et dans une div à part je met mon image fixe de haut a gauche du style :

div#bg {
  background-image:url(images/background3.jpg);
  background-repeat : no-repeat;
  background-attachment: fixed;
  background-position:top left;
}

* Pour ie6, j'utilise une librairie javascript qui simule le même comportement que sous ie 7 que j'ai récupéré à l'adresse suivante :

http://code.google.com/p/ie7-js/

J'ai laissé l'image du haut à gauche dans le body (contrairement à firefox) et utilise cette librairie uniquement pour le background fixed d'en bas à droite comme ça si javascript desactivé, impact quasi invisible.

Voila j'espère que ça pourra inspirer ou aider d'autre que moi à l'avenir,
Cdt,
Realworld