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 !

EFFET MACHINE À ÉCRIRE OU TYPEWRITER V1.0


Information sur la source

Catégorie :Effets de textes Classé sous : typewritter, machine, écrire, texte, progressif Niveau : Débutant Date de création : 18/06/2004 Date de mise à jour : 31/10/2008 11:43:30 Vu / téléchargé: 44 185 / 7 698

Note :
5,44 / 10 - par 16 personnes
5,44 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10

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

Description

Cliquez pour voir la capture en taille normale
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

  • //---------- 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);
  • }
  • }
//---------- 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);
	}
}

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

22 décembre 2004 02:24:43 :
22 décembre 2004 02:28:39 :
23 janvier 2005 17:20:37 :
22 décembre 2005 00:39:48 :
Explications concernant l'activation des balises HTML sur la zone de texte.
20 juin 2007 19:28:57 :
Virer mon email...
22 août 2007 13:47:48 :
Version 2.0 en prototype.
22 août 2007 13:49:53 :
Version proto
22 août 2007 14:38:36 :
Pas une bonne idée le proto
03 novembre 2007 20:27:16 :
suppression du zip
03 novembre 2007 20:31:43 :
ajout fichier flash
31 octobre 2008 11:43:30 :
Suppression email

Commentaires et avis

signaler à un administrateur
Commentaire de 16r le 25/06/2004 19:56:25

joli ... joli :) ca seré kan meme mieu si il y avé une police plus adaptée (machine a ecrire justement) et pis un peu plus d'effets graphiques lol .. Sinon c'est bien :)

signaler à un administrateur
Commentaire de SirHK le 28/10/2004 15:04:59

Bah moi j'adore c simple c marche c nikel :)

signaler à un administrateur
Commentaire de vtoma95 le 20/11/2004 11:46:19

Comment faire pour avoir 2 textes à des endroits différents? Ce programme marche pour un seul texte au départ et j'aimerais y placer un second mais je ne suis pas parvenu à adapter le code...Merci pour votre aide!

signaler à un administrateur
Commentaire de snotsnot le 10/01/2005 22:55:34

ba la presentation est po forcement tres esthetique mais le fonctionnement est bien expliqué , c est le principal :-)

signaler à un administrateur
Commentaire de choinet le 27/05/2005 18:07:08

ya pas moyen d'importer un fichier txt ou Xml, plutot que de se taper le texte à réecrire dans les lignes de prog? Sinon, le principe est interessant.

signaler à un administrateur
Commentaire de badben le 22/06/2005 14:13:17

Si mais je n'ai pas voulu faire très compliqué. Et puis tu n'es pas obligé de tout réécrire, le copier-coller est là pour ça.

Ensuite à toi d'adapter le code à ta façon pour y intégrer du contenu XML ou TXT.

signaler à un administrateur
Commentaire de fjohn le 08/07/2005 15:21:23

Formidable, je te remercie, ca me rend super service, depuis hier que je cherche à titrer une video de cette facon, grace a toi, c'est gagne, merci !

signaler à un administrateur
Commentaire de stella2809 le 20/07/2005 16:33:59

ce code m'a beaucoup aidé mais il me reste un petit souci lorsque je copie : texte ="Bonjour,<br><b><font color='#666666'>ici le typewritter</font></b>"; dans mon fichier de travail. Toutes les balises s'affichent..
Aidez moi merci

signaler à un administrateur
Commentaire de jejo23 le 02/09/2005 11:59:50

moi aussi les balises s'affichent
que faut il faire pour qu'il reconnaisse le html?

signaler à un administrateur
Commentaire de lotfi2benak le 15/11/2005 05:45:55

ça ma aider ;-) thank's

7/10

signaler à un administrateur
Commentaire de astreeflash le 22/02/2006 09:48:49

Ouè super !

Merci.

signaler à un administrateur
Commentaire de Nico0 le 21/04/2006 21:45:07

Merçi, c'est génial! Je vais en profiter pour faire ma présentation pour le forum! Merçi!!!!

signaler à un administrateur
Commentaire de peyothe le 02/05/2006 15:42:53

Simple et efficace !
Merci :)

signaler à un administrateur
Commentaire de maxence31 le 01/09/2006 14:03:23

très chouette.
J'aurais simplement voulu savoir comment ou pourrait changer la typo du texte.
Merci :)

signaler à un administrateur
Commentaire de Titi035 le 27/09/2006 16:38:17

Merci pour cette source!

Pour changer la typo, tu cliques sur la zone de texte et tu choisis la taille et la police que tu veux...

signaler à un administrateur
Commentaire de petit_guerrier le 28/11/2006 18:52:37

salut, super cette source!

J'ai une chtite question, j'ai besoin de coder l'arrivée du texte au survol d'un bouton...je suis pas un as du code...Quelqu'un connaît la marche à suivre?
Car pour l'instant, le texte s'affiche dès l'ouverture du swf.

Merci bien:)

signaler à un administrateur
Commentaire de petit_guerrier le 30/11/2006 19:01:49

re:)

mauvaise surprise:

j'appelle avec un bouton un swf extérieur qui contient le code et à chaque passage sur le bouton le texte défile de plus en plus vite...comme s'il restait en cache. Pareil avec un bouton qui actionne le code à chaque survol sans appeler de fichier extérieur.

Aprés 2-3 passage, on perd presque tout l'effet de défilement, le texte apparaît presque d'un bloc.

vous allez me dire, vide le cache, oui mais non parce que j'en ai besoin pour par recharger des films en streaming parralèlement.

signaler à un administrateur
Commentaire de malikasais le 02/12/2006 09:10:38

bonjour
j'ai beaucoup aimé ce programme je cherchais depuis longtemps mais pour le texte en arabe comment faire est ce que je change uniquement le texte ou y'a t-il d'autre chose a faire merci beaucoup

signaler à un administrateur
Commentaire de trucage le 19/05/2007 12:30:10

Très bon script ! merci !

signaler à un administrateur
Commentaire de almasy le 20/06/2007 18:23:36

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 :)

signaler à un administrateur
Commentaire de badben le 22/08/2007 12:00:13

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 :

<font color='#00FF00'>texte</font>

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.

signaler à un administrateur
Commentaire de jojoss le 17/03/2008 21:15:41 6/10

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

signaler à un administrateur
Commentaire de vegetalain le 24/07/2008 16:36:44

trop cool mais euh, comment faire pour rajouter un curseur clignotant en fin de phrase genre, vieux pc à la "WarGames" ?!

signaler à un administrateur
Commentaire de minouchka54 le 25/12/2008 07:18:28 8/10

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

Ajouter un commentaire

Discussions en rapport avec ce code source dans le forum

machine à écrire avec plusieurs phrase [ par kallawoen ] Bonjour,J'ai un souci, j'aimerai faire défiler plusieurs texte en style ( machine à écrire) l'un après l'autre, donc quand le premier est terminé il s affichage texte progressif avec lettres aleatoires... [ par crashtoy ] Bonjour a tous!Alors voila : je souhaite creer un effet d'affichage de texte particulier mais je ne sais vraiment pas comment m'y prendre...Je m'expli effet machine a ecrire [ par ffardt ] Je voudrais réaliser un effet machine a ecrire sur texte d'une vingtaine de lignes. Pour l'instant je l'ai fait en animations en déplaçant des masques Comment faire pour écrire des variables dans un fichier texte [ par rasta_cool ] J'ai sais que flash ne peut lui-même enregistrer dans un fichier texte. Je ne trouve rien pour un fichier php, asp ou autre pour enregistrer dans un f écrire en machine a écrire [ par lucbrady ] Bonjour, Je suis débutant en flash. J'ai créé un fichier flash AS.2 dans lequel je souhait écrire des guillemets dans un texte... [ par vegetalain ] Resalut, j'ai posé une question y'a genre 10 minutes sur le xml, est c'est résolu, donc vo ilà :Deuh... par contre, j'ai jugé bon de remettre une autr mise en forme de texte [ par kirkoko ] Oy, Bonjour à tous,qui saurait comment faire pour que sur le swf: ont puisse :écrire un texte dans un "texte box"  et afficher dans une autre "texe ar Son, sur l'effet de machine à écrire [ par eldidou ] El Didou - étudiant en multimedia à ToulonSalut,en fait, je voudrait utiliser l'effet de texte de machine à écrire (http://www.flashkod.com/code.aspx? j'ai un bug dans une animation de grattage [ par tier ] Bonjourj'ai fait un grattage automatique qui laisse apparaitre du texte quand on gratte.Ce que je ne comprend pas, c'est que cela marche dans la zone aidez moi svp [ par thelover2fr ] salut a tousje suis debutant en flash et je souhaiterai faire quelques petites animations en texte.j'ai commencé un peu mais je ne sais pas comment fa


Nos sponsors

Sondage...

CalendriCode

Juillet 2009
LMMJVSD
  12345
6789101112
13141516171819
20212223242526
2728293031  

Consulter la suite du CalendriCode

Comparez les prix Nouvelle version

Photothèque Nouveau !



Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), 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,406 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é.