Faire un Fade-In & un Fade-Out.
linux1155
Messages postés
35
Date d'inscription
Statut
Membre
Dernière intervention
-
linux1155 Messages postés 35 Date d'inscription Statut Membre Dernière intervention -
linux1155 Messages postés 35 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
J'aimerais faire apparaître ma-page-web, suite à un clic sur une autre page, faire apparaître ma page en Fade-In de rien à 100%, puis lorsque l'usager clic sur un bouton, je fais un Fade-Out pour afficher une autre page. Je suis sur que c'est possible, pour l'avoir déjà vue, J'ai trouvé quelque chose en JQuery, mais je n'y connais rien, alors en Javascript serait idéal.....
J'aimerais faire apparaître ma-page-web, suite à un clic sur une autre page, faire apparaître ma page en Fade-In de rien à 100%, puis lorsque l'usager clic sur un bouton, je fais un Fade-Out pour afficher une autre page. Je suis sur que c'est possible, pour l'avoir déjà vue, J'ai trouvé quelque chose en JQuery, mais je n'y connais rien, alors en Javascript serait idéal.....
A voir également:
- Faire un Fade-In & un Fade-Out.
- Av out - Forum Cinéma / Télé
- A quoi servent les prises av in et av out su - Forum Audio
- Dc in - Forum Audio
- Deco in paris avis ✓ - Forum Consommation & Internet
- Navigation in private - Guide
En fait j'ai trouvé ce code.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Mon compte</title>
<script type="text/javascript">
var TimeToFade = 1000.0;
function fade(eid)
{
var element = document.getElementById(eid);
if(element == null)
return;
if(element.FadeState == null)
{
if(element.style.opacity == null
|| element.style.opacity == ''
|| element.style.opacity == '1')
{
element.FadeState = -2;
}
else
{
element.FadeState = 2;
}
}
if(element.FadeState == 1 || element.FadeState == -1)
{
element.FadeState = element.FadeState == 1 ? 1 : -1;
element.FadeTimeLeft = TimeToFade - element.FadeTimeLeft;
}
else
{
element.FadeState = element.FadeState == 2 ? 1 : -1;
element.FadeTimeLeft = TimeToFade;
setTimeout("animateFade(" + new Date().getTime() + ",'" + eid + "')", 33);
}
}
function animateFade(lastTick, eid)
{
var curTick = new Date().getTime();
var elapsedTicks = curTick - lastTick;
var element = document.getElementById(eid);
if(element.FadeTimeLeft <= elapsedTicks)
{
element.style.opacity = element.FadeState == 1 ? '1' : '0';
element.style.filter = 'alpha(opacity = '
+ (element.FadeState == 1 ? '100' : '0') + ')';
element.FadeState = element.FadeState == 1 ? 2 : -2;
}
element.FadeTimeLeft -= elapsedTicks;
var newOpVal = element.FadeTimeLeft/TimeToFade;
if(element.FadeState == 1) {
newOpVal = 1 - newOpVal;
}
element.style.opacity = newOpVal;
element.style.filter = 'alpha(opacity = ' + (newOpVal*100) + ')';
setTimeout("animateFade(" + curTick + ",'" + eid + "')", 33);
}
function retour() {
window.location.href="principal.php";
}
</script>
</head>
<body id="block" onclick=fade("block")>
<div>
<h1>Juste pour voir si ça fonctionne</h1>
<p><input type="submit" value="Retour" onclick="fade("block"); retour()"/></p>
</div>
</body>
</html>
Il ne fais pas de Fade-in de 0 à 100%, fais le fade-out, mais ne me redirige pas à principal.php.
J'ai fais plusieurs tounipette............ sans succès......... j'ai cherché autre code mais en vain.
Alors un gros HELP!
Merci.