Effet machine à écrire ou typewriter v1.0

3/5 (24 avis)

Vue 64 338 fois - Téléchargée 8 811 fois

Description

Un Effet de texte tout simple, qui ressemble à celui d'une machine à écrire appelé effet TypeWriter entièrement réalisé en ActionScript.

Attention quelques règles à respecter :
Si vous mettez des balises HTML, evitez les listes <li> et les images <img...
sinon votre texte va entièrement bugger et vos images ne s'afficheront pas.
Les autres balises elles marchent à peu près toutes.

A vous de customizer votre animation pour qu'elle soit plus esthétique.

Si flash vous affiche toujours les balises HTML lors du rendu c'est que les balises HTML ne sont pas activés sur la zone de texte. Cliquez sur l'icone <A> puor activer ces balises.

Source / Exemple :


//---------- Typewriter v1.0 by badben ----------//
//
//Texte à afficher comprenant des balises HTML
texte = "Bonjour,<br><b><font color='#FF00FF'>ici le typewritter</font></b>";
//Taille du texte à afficher
taille = texte.length;
//variable du champ de texte "contenu" initialisée
contenu = "";
//variable initilisée à 0
i = 0;
//"type" designe le nom de la fonction "SetInterval",
//"SetInterval" = La fonction "typewriter()" sera lancée toutes les 20 ms 
type = setInterval(typewritter, 20);
//fonction qui va ajouter une lettre à chaque fois quelle sera lancée
function typewritter() {
	//on ajoute la lettre à la position "i" à la fin de la variable "contenu"
	contenu = contenu+texte.charAt(i);
	//incrémentation de "i" pour ajouter la lettre suivante
	i++;
	//si "i" est égal à la taille du texte cela veut dire qu'il a finit d'afficher tous les caractères
	//cela permet d'éviter de laisser tourner le "setInterval" idéfiniment
	if (i == taille) {
		//Arrêt de la fonction "SetInterval"
		clearInterval(type);
	}
}

Codes Sources

A voir également

Ajouter un commentaire Commentaires
minouchka54
Messages postés
1
Date d'inscription
samedi 30 décembre 2000
Statut
Membre
Dernière intervention
25 décembre 2008

25 déc. 2008 à 07:18
Génial ton preloader! C'est léger dans une page web et ça fonctionne sans effort.
Merci, ça m'a été très utile
vegetalain
Messages postés
745
Date d'inscription
mardi 25 mars 2003
Statut
Membre
Dernière intervention
14 juillet 2015

24 juil. 2008 à 16:36
trop cool mais euh, comment faire pour rajouter un curseur clignotant en fin de phrase genre, vieux pc à la "WarGames" ?!
cs_jojoss
Messages postés
14
Date d'inscription
jeudi 24 février 2005
Statut
Membre
Dernière intervention
15 octobre 2009

17 mars 2008 à 21:15
Bonjour badben,

Superbe ton flash, ca fait un petit moment que j'en cherche un de ce type, malheureusement pour moi je connais rien en flash... et je ne peux rien en faire. a tu dans l'idée de le modofier avec un fichier xml???


encore bravo, il est superbe ton flash

Jojo
cs_badben
Messages postés
55
Date d'inscription
vendredi 12 mars 2004
Statut
Membre
Dernière intervention
22 août 2007

22 août 2007 à 12:00
C'est normal que le texte ralentisse lorsque celui ci change de couleur. Tout simplement parce que la tête de lecture doit lire tous les caractères un par un comme par ex :

texte

L'effet lit la balise (qui n'apparait pas) avant d'afficher le texte.
Il en est de même pour toutes les balises html.

Je ferais mieux de faire un prototype pour ce code source.
cs_almasy
Messages postés
2
Date d'inscription
vendredi 30 juillet 2004
Statut
Membre
Dernière intervention
20 juin 2007

20 juin 2007 à 18:23
Salut bigben, très bon script, tout fonctionne impéccablement, cependant, j'ai remarqué que le texte ralentissait au moment du passage d'un mot en couleur, serait il possible d'accélérer la vitesse du texte dans son ensemble ?

Merci :)
Afficher les 24 commentaires

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.