EFFET DE VAGUE SUR DU TEXTE (HORIZONTAL / VERTICAL) Vague, texte, ondulation, effet, Source N°16247

Information sur la source

Catégorie :Trucs Amusants Classé sous : Vague, texte, ondulation, effet Niveau : Initié Date de création : 17/06/2003 Date de mise à jour : 25/08/2008 18:56:21 Vu / téléchargé: 5 693 / 540

Auteur : jerms

Ecrire un message privé

Note :

8,50 / 10

1
2
3
4
5
6
7
8
9
10

Commentaire sur cette source (11)

Ajouter un commentaire et/ou une note

Description

Cliquez pour voir la capture en taille normale

Un petit script pour faire un effet de vague sur une chaine de caractères.
possibilité de paramétrer le sens de la vague, ainsi que les tailles maximale et minimale de caractères.

Bon je retire le code parce que j'ai rajouter 2 autre version avec dégradé, et puis au moins je suis sur que ça fonction ;)

en essayant quelque chose j'ai remarqué que c'est sympa aussi, donc si on met chaque lettre dans une DIV on a l'effet a la vertical !!

j'ai rajouté un test sur la chaine de caractères pour détecter les codes Unicodes (par exemple ạ). C'est mieux d'avoir l'effet avec le caractère correspondant que l'Unicode :) (merci LUONGM pour la question à ce sujet)

Source

Zip Zip Zip

Zip Zip Zip

Conclusion

je rajoute un Zip avec 7 exemples dedans :
- effetVague : l'effet de vague tout simple sur du texte
- effetVagueDegradeFixe : l'effet de vague sur du texte avec un dégrade fixe sur le texte
- effetVagueDegradeFlotant : l'effet de vague sur du texte avec un dégrade qui suit la vague
- les 3 autres c'est idem mais a la vertical
- effetDoubleVague : en fait les caractères sont centrés donc ils ondulent en haut et en bas.

si jamais vous avez encore des remarques, des améliorations ;)

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 !

EffetDoubleVague.html 2 185 octets
EffetVagueDegradeFixe.html 2 731 octets
EffetVagueDegradeFixeVertical.html 2 708 octets
EffetVagueDegradeFlotant.html 2 874 octets
EffetVagueDegradeFlotantVertical.html 2 831 octets
EffetVagueVertical.html 2 166 octets

Télécharger le zip

Historique

25 août 2008 18:56:21 :: Modification du code pour tenir compte des codes unicodes contenu dans la chaîne de carctère

Sources du même auteur

Toutes les sources de jerms

Sources de la même categorie

Toutes les sources de la catégorie Trucs Amusants

Sources en rapport avec celle ci

Commentaires

Commentaire de mehdibou le 17/06/2003 19:05:21

Excellent :) 9,49/10
Le seul pb, c'est qu'il bouge en hauteur (donc à utiliser dans un conteneur avec valign="middle").
Et...pk ne pas rajouter une fonction de dégradé de couleur ?
Commentaire de jerms le 17/06/2003 21:10:40

tiens j'avais pourtant rajouter devant le texte un espace de la taille maxi pour justement qu'il ne bouge pas, mais la je crois qu'il n'apparait....
je vais voir, et pour le dégradé pour quoi pas, un dégradé qui suit la vague, ou fixe ?
Commentaire de bob3000 le 18/06/2003 18:44:48

excellent
Commentaire de ampeg le 04/07/2003 17:16:14

Avec une capture se serait mieux !!!
Commentaire de jerms le 04/07/2003 23:25:56

Voilà la capture est arrivé, bon j'ai juste prixune image de chacun de mouvements horizontaux ;)
Commentaire de Mumuri le 05/07/2003 17:45:42

trop fort
Commentaire de cristina49 le 17/07/2003 16:34:23

c génial ton truc
une petite question toute bête : comment qu'on fait si on veut pas avoir l'effet vague ( les lettres qui bougent en hauteur ) en gardant l'effet de couleur ....

mimi
Commentaire de jerms le 17/07/2003 20:30:26

merci, merci, ben si tu veux pas que le texte bouge, il suffit de mettre en commentaire ou de supprimer la ligne :
timer = setTimeout("effetVague()",20)

logiquement tu devrait avoir la vague fixe.
A+ jerm's
Commentaire de cristina49 le 23/07/2003 15:21:41

je ne trouve pas cette ligne de code dans le code html de la page. de plus il faut que je fasse koi : que je l'enlève ou que je l'ajoute ( si je doit l'ajouter je l'ajoute ou et comment ... )
merci d'avance

mimi ;-))))
Commentaire de sabylau le 02/04/2004 11:09:36

Bonjour, je voudrais savoir comment changer les couleurs du texte et la typo ? Est-ce possible de faire onduler la vague moins rapidement ?
Merci
Commentaire de jerms le 02/04/2004 16:42:10

- pour changer la vitesse faut modifier la ligne suivante :
timer = setTimeout("effetVague()",30)
30 c'est 30 millisecondes, pour que ce soit plus lent tu augmentes, pas trop sinon c'est pas beau.

- si tu veux changer la police du texte tu peux mettre la DIV dans une balise font :
<FONT face="arial"><DIV ID=txt1>+</DIV></FONT>

- pour la couleur faut changer :
initEffetVague("txt1",230,170,0,100,255,255)
en fait ce sont les couleur en décimal (Rouge, Vert, Bleu) entre 0 et 255.
Les 3 premiers chiffres pour la couleur de départ, et les 3 derniers pour la couleur d'arrivée.

j'espere que ca pourra t'aider.
a+
Jerm's