Fondu entre 2 pages

Thierry Chabenat
Les bases HTML/CSS

Bonjour,

Je recherche à créer un fondu entre 2 pages sur mon site.
J'ai une page de pré-accueil (index.html) et je voudrai que la page principale (index.php) s'ouvre automatiquement en fondu au bout de quelques secondes avec un effet de fondu.

Le code que j'ai pour l'instant ressemble à ça :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Radio Balistiq - Yes we can can</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<SCRIPT>
window.onload = function() {MakeFluffHappen()}
function MakeFluffHappen() {
FluffyKittenMaker(0);
Conflaburator(0);
}
function FluffyKittenMaker(SomeNumberThing) {
document.body.style.opacity = SomeNumberThing/100;
}
function Conflaburator(SomeNumberThing) {
if (SomeNumberThing <= 100) {
FluffyKittenMaker(SomeNumberThing);
SomeNumberThing += 2;
window.setTimeout("Conflaburator("+SomeNumberThing+")", 100);
}
}
</SCRIPT> 
<body bgcolor="#000000" text="#CCCCCC" link="#999999" DIR="LTR" STYLE="opacity:0">
<table width="100%" border="0" cellpadding="0" cellspacing="0" align="center">
    <tr>
      <td><p align="center"> <a href="index.php"><img src="images/logo.jpg" alt="radio balistiq" border="0"></a></p></td>
    </tr>
</table>
</div>
</body>
</html>

Merci infiniment pour votre aide.

3 réponses

Grafikart

Trop complexe par rapport à ton niveau je pense, il faut que tu fasse de l'ajax tu va te prendre la tête pour pas grand chose

LesTutossUE4

Solution alternative :
Tu fusionnes les deux pages et tu fait l'effet fondu en JQuery.
Si tu as besoin d’exécuter du PHP, implémente de l'Ajax lors de la fin d'animation.
Si tu as besoin d'aide, re-dis nous.

Benjamin Derepas

Je vais proposer quasiment la même solution que Grafikart et Sunny :
Tu peux créer une page index.html, puis un fichier a coté, un timeout en javascript, un .load, et fadeOut de la première page, puis un fadeIn de la seconde pas.

Mais comme l'a dit Grafikart, à voir ton code, je t'invite à retravailler un peu les bases HTML-CSS, et de regarder par la suite quelques tutoriels sur jQuery