J'ai une page Web avec une image de corps de fond en mosaïque. Il doit être carrelé car le concepteur le veut évolutif avec la fenêtre du navigateur. Il crée une grille très spécifique sur laquelle le reste du site est conçu. Il y a également une bordure de page blanche autour de celle-ci (créée via une div séparée avec un index z plus élevé) car le concepteur souhaite garder le motif éloigné des côtés du navigateur.Besoin de fondre dans le contenu entier d'une page Web sur la charge mais le modèle bg carrelé continue à faire le contraire
J'ai besoin de fondre la page suivante dans son intégralité. Lorsque j'essaie de fondre dans le corps, l'écran commence avec le motif déjà présent. Et en jouant, j'ai aussi réussi à faire fondre l'arrière-plan, mais tout le reste s'estompe. J'ai également essayé de placer le modèle de bg dans une div juste au-dessous du corps, mais il semble faire des choses étranges dans Safari.
J'ai aussi essayé le tutoriel suivant, mais en vain:
http://blog.anselmbradford.com/2009/08/28/how-to-add-a-simple-webpage-fade-in-effect-using-jquery/
Ma pensée est alors de construire en quelque sorte un div blanc superposant tout, la décoloration, puis cela. Mais comment faire pour que ce div couvre tout, y compris l'image de fond du corps?
Je me sens comme si je manque quelque chose de grand ici ...
Voici le code correspondant, je travaille avec:
HTML:
<body id="home">
<div id="pgborder"></div><!-- end #pgborder-->
<div id="main">
<ul id="nav">
<li><a href="us.html">us</a></li>
<li><a href="work.html">work</a></li>
<li><a href="contact.html">contact</a></li>
</ul>
</div><!-- end #main-->
<div id="logo">
<a href="home.html"><img src="images/logo.gif" width="345" height="24" alt="manuchugh logo"/></a>
</div><!-- end #logo-->
</body>
CSS:
html, body {
height: 100%;
font-family: "century gothic", arial, sans serif;
color: #8c8d8d;
font-size: 15px;
overflow: auto;
background:#fff url('../images/bg.gif');
}
#pgborder {
border: 22px #fff solid;
}