Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

ANIMATION DYNAMIQUE DE BIENVENUE


Information sur la source

Catégorie :Effets Niveau : Initié Date de création : 02/07/2005 Date de mise à jour : 13/07/2005 14:47:05 Vu / téléchargé: 9 338 / 1 457

Note :
8 / 10 - par 6 personnes
8,00 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10

Commentaire sur cette source (8)
Ajouter un commentaire et/ou une note

Description

C'est une animation dont le texte s'agrandit progressivement puis change pour laisser la place à un autre texte, tout cela dynamiquement. Je vous conseille de regarder le résultat si l'explication n'est pas explicite ! Vous pouvez changer le texte ligne 15.

 

Source

  • <html>
  • <head>
  • <title>animation</title>
  • </head>
  • <body>
  • <div align="center" id="bienvenue">
  • </div>
  • <script>
  • <!--
  • i=0;
  • taille=0;
  • hauteur = (navigator.appName != "Microsoft Internet Explorer")? window.innerHeight : document.body.offsetHeight;
  • marge = hauteur/3;
  • document.getElementsByTagName('div')[0].style.marginTop = marge;
  • textanim = new Array("Bienvenue","sur","mon","site","perso !");
  • function animation() {
  • document.getElementsByTagName('div')[0].style.fontSize = ""+taille+"px";
  • document.getElementById('bienvenue').innerHTML = textanim[i];
  • if (taille < 150) {
  • taille++;
  • }
  • else {
  • i++;
  • taille=0;
  • }
  • if (i < textanim.length) {
  • setTimeout('animation()',20)
  • }
  • }
  • setTimeout('animation()',20);
  • //-->
  • </script>
  • </body>
  • </html>
<html>
<head>
<title>animation</title>
</head>
<body>
<div align="center" id="bienvenue">
</div>
<script>
<!--
i=0;
taille=0;
hauteur = (navigator.appName != "Microsoft Internet Explorer")? window.innerHeight : document.body.offsetHeight;
marge = hauteur/3;
document.getElementsByTagName('div')[0].style.marginTop = marge;
textanim = new Array("Bienvenue","sur","mon","site","perso !");
function animation() {
document.getElementsByTagName('div')[0].style.fontSize = ""+taille+"px";
document.getElementById('bienvenue').innerHTML = textanim[i];
if (taille < 150) {
taille++;
}
else {
i++;
taille=0;
}
if (i < textanim.length) {
setTimeout('animation()',20)
}
}
setTimeout('animation()',20);
//-->
</script>
</body>
</html>

Conclusion

Le script est compatible avec tous les navigateurs. N'hésitez pas à me donner des conseil sur ce script !
 

Fichier Zip

Pour les "Membres Club", vous pouvez télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip

Historique

13 juillet 2005 14:47:05 :
ajout d'un zip

Commentaires et avis

signaler à un administrateur
Commentaire de massacr le 03/07/2005 15:58:42

Joli, mais tu devrais ajouter la gestion des couleurs, avec un changement des couleurs progressifs. Le dernier mot devrait s'en aller, et faire une redirection.

Mais c'est un bon code. A+

signaler à un administrateur
Commentaire de peter1789 le 04/07/2005 12:42:33

                    Bonjour MASSACR !

Je ne vais pas changer mon code car je veux que chacun puisse personnaliser ce script...

              @+

signaler à un administrateur
Commentaire de meh le 04/07/2005 15:39:06

Toujours le même problème : pourquoi ça clignote sur Firefox ?

signaler à un administrateur
Commentaire de massacr le 04/07/2005 16:11:37

lol Peter1789. On pourra le personnaliser meme si tu l'amèliore. Parce que si on suit ton idée, je vais pas donner mon code parce que je veux que les autres le fasse eux meme. C'est pas trop la logique de Codes-Sources...

signaler à un administrateur
Commentaire de darkman2 le 17/08/2005 10:03:39

super ton script
mais ca aurait été mieux avec des couleurs
mais c'est ton script

signaler à un administrateur
Commentaire de kurgan83 le 26/09/2005 10:46:19

hello Peter !
Je suis un petit nouveau dans la prog' et je voulais savoir si on pouvait redimentionner la balise <div> dans ton script ?

signaler à un administrateur
Commentaire de lymoce le 27/05/2007 20:19:05

pal mal le script bon courage  

signaler à un administrateur
Commentaire de tomaste le 13/10/2007 17:26:29

C'est une animation dont le texte s'agrandit progressivement, je vole le code an un table and funtion de zoom,

merçi,

tomas

Ajouter un commentaire



Nos sponsors

Sondage...

CalendriCode

Octobre 2008
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
2728293031  

Consulter la suite du CalendriCode



Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel BAÏSE, Merci à Vincent pour ses précieux conseils
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés
Temps d'éxécution de la page : 0,140 sec

Google Coop CodeS-SourceS Google Coop CodeS-SourceS


Certaines images présentes sur le site (notament certains avatars) sont issues des collections IconShock, donc si vous souhaitez utiliser ces icons vous devez les acheter, ne les copiez pas et ne utilisez pas dans vos sites et applications sans les avoir commandé.