Tapuscrit

Article écrit par : Patrice Nadam
Première mise en ligne le 29 mai 2020
Mise à jour le 21 décembre 2020
Un effet machine à écrire dans Genially

Suite à une demande sur notre groupe Facebook, nous sommes partis à la recherche d’un script permettant de créer l’effet d’apparition des lettres à la manière d’une machine à écrire. Dans un premier temps, nous avons expliquer la méthode pour intégrer ce code directement dans un Genially.

Toujours dans l’objectif de faciliter les usages, nous avons développé par la suite le Tapuscrit , une extension facilitant la modification du style du texte (taille, police, couleur...). Nous avons également créé deux paramètres modifiables : la vitesse d’apparition des lettres ainsi qu’un délai de lancement de l’effet. Cette latence permet de synchroniser le tapuscrit avec les animations susceptibles d’être ajoutées dans les pages.

Cette nouvelle version est également compatible avec le SACÉFÉ et permet l’affichage conditionnel des variables, comme le montre l’exemple créé par Hervé.

Hervé Thomas a amélioré l’outil en proposant dans la version 2 la possibilité d’accélérer le défilement ou d’afficher d’un coup la totalité du texte. Le Tapuscrit 2 (version 2.1) permet aussi d’afficher dans une même page plusieurs zones de texte en mode machine écrire et de faire apparaître en parallèle d’autres objets Genially.

 

Ancienne version

Nous avons conservé la version antérieure pour les utilisateurs désireux de manipuler le code.

  • Modifiez en fonction de vos besoins quelques éléments du script (le texte à afficher, sa taille et la vitesse d’affichage).
  • Copiez le script.
  • Collez-le dans le cadre Insérer AUTRES de Genially.
  • Redimensionnez et positionnez dans la page l’élément créé.

Source du code : https://webdevpro.net/js-effet-apparition-lettres/

Il est possible de modifier la couleur du texte, la couleur du fond, la graisse du texte en ajoutant des paramètres idoines dans l’attribut style.

Tutoriels vidéo

  • En Polonais par Agnieszka Kubica et Joanna Wasilewska (Mishmash tips)
  • En espagnol par GoodatMaths

Autres extensions