Loader une page en ajax avec un petit effet

Description

Bonjour,

alors, après avoir recu de l'aide sur le forum pour savoir comment créer une fonction avec les "Effect",
j'ai poussé un tout tout petit peu plus loin, et je me suis dis que cela peut intéresser qqn.

C'est une fonction permettant de charger une page externe dans une div (ou autre) avec un effect Fade (modifiable).
A noter qu'il y a besoin de prototype.js et scriptaculous.js

Source / Exemple :


<head>
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="scriptaculous.js"></script>
<script type"text/javascript" src="effect.js"></script>
<script type="text/javascript">
function davePageLoader(divTarget,divUrl)
{ 
new Effect.Fade(divTarget, 
{
duration    : 0.4,
afterFinish : function()
{ 
new Ajax.Updater(divTarget, divUrl, 
{
onComplete : function() 
{
new Effect.Appear(divTarget);
}
});
}
});
}
</script>
</head>

<body>
<p>Ceci est un petit cript permettant de loader une page dans une div en remplacant son contenu premier, avec un petit effet ajax.</p>
<div><a href="#" onClick="davePageLoader('laDiv','lapage.html')">Essayer</a></div>
<div id="laDiv"><p>ceci est le tete premier</p></div>

</body>
</html>

Conclusion :


Bon, comme c'est ma première source, merci pour les futurs commentaires.

Codes Sources

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.