Code saisissant des animations de texte avec jQuery TypeIt

le combo de jQuery et texte ne détient aucune limite sur le web. Vous pouvez construire presque n'importe quoi avec un peu de créativité et les bonnes bibliothèques JavaScript.

Une telle bibliothèque est Taper, construit comme un plugin gratuit jQuery. Il vous permet de créer animations de frappe dynamiques cela a l'air incroyablement réaliste. Vous pouvez même définir des pauses personnalisées entre les frappes pour créer votre propre atténuation pour l'animation..

TypeIt est 100% gratuit et open-source, construit en tant que outil de texte pour la communauté jQuery. Toute la documentation est disponible en ligne et incroyablement facile à suivre.

Cependant, il suffit de noter que TypeIt est livré avec un licence personnelle gratuite, les licences commerciales coûtent malheureusement de l'argent. Mais, vous pouvez utiliser la licence personnelle gratuite pour toujours et n'expire jamais, c'est donc une excellente ressource pour tous vos projets personnels ou même votre site Web personnel.

Vous pouvez commencer par ajout du fichier JavaScript TypeIt brut via CDN droit à l'en-tête de votre page. Ajoutez ensuite jQuery, écrivez du texte et connectez-le tous ensemble. Simple!

En règle générale, vous aurez cibler une div spécifique sur la page et l'utiliser comme un conteneur pour l'animation de texte. Voici un exemple d'extrait de code pour vous montrer comment cela fonctionne:

 $ ('. type-it'). typeIt (strings: ['This is my string!']); 

Par passer des options personnalisées au taper() vous pouvez ralentir la vitesse de frappe, ajouter des pauses à certains intervalles et même réinitialiser les paramètres à certains intervalles pour modifier la vitesse de frappe en cours.

Vous pouvez même tester ces options sur la page du plugin si vous êtes prêt à passer du temps à fouiner avec les paramètres.

Ce constructeur d'animation de texte est l'exemple parfait de ce que vous pouvez faire avec ce plugin. Vous obtenez tellement d'options personnalisées que vous pouvez même créer une application Web., en utilisant ce plugin, à créer des animations à la volée!

Sur la page principale du plugin, vous trouverez également options plus avancées vers le bas avec des extraits de code que vous pouvez copier.

Alors, téléchargez TypeIt et tentez votre chance! Une fois que ça fonctionne, c'est vraiment très amusant. Et si vous avez des questions ou des suggestions pour le développeur, vous pouvez le contacter sur Twitter @amacarthur..