Actualización del complemento de efecto de máquina de escribir MooTools -

La semana pasada compartí micrófono de máquina de escribir MooTools contigo. Fue bastante bien recibido y recibí algunas solicitudes de funciones que implementé, incluido el “retroceso” y los retrasos en la variación de caracteres. No voy a explicar el código antiguo, así que haz clic aquí para obtener la explicación completa de la clase.

Clase MooTools 1.2

//la clase es invar Typewriter = new Class({//implementsImplements: [Options],//optionsoptions: {container: $$('body')[0],message: '',delay: 150,cursor: 0 , varianza: 0,backChar: '|',backDelay: 30},//initializationinitialize: function(options) {//set optionsthis.setOptions(options);},//iniciar la máquina de escribirstart: function() {/ /para cada letterfor(x = 0; x this.options.message.length; x++){var ritmo = (this.options.delay * x) + $random(0,this.options.variance);var current = this .options.message.charAt(x);//escupe la letraif(current != this.options.backChar){var go = this.setLetter.delay(pace,this);}else{var go = this.deleteLetter. delay( ritmo + this.options.backDelay,this);}}},//coloca la letra más nueva en el contenedorsetLetter: function() {this.options.container.set('html',this.options.container. get(' html') + '' + this.options.message.charAt(this.options.cursor));//incrementa el cursorthis.options.cursor++;},//elimina una letra - va hacia atrásdeleteLetter: function( ) {este. options.container.set('html',this.options.container.get('html').substr(0,this.options.container.get('html').length - 1));//incrementar cursorthis .opciones.cursor++;}});

Uso de MooTools

var t = new Typewriter({container: $('type-here'),mensaje: 'Este es el resultado de la clase Typewriter. Esta clase es pequeña pero ofrece una muy buena||||||||||| SUPER ENORME golpe. ¿No es genial MooTools?',delay:90,variance:200,backChar: '|',backDelay:30}).start();

Verás tres nuevas opciones:

• Variación: nadie escribe a la misma velocidad para cada letra. La variación permite cambios aleatorios de demora de letras.
• volverChar: ¿ Qué carácter significa retroceso?
• backDelay: ¿Qué tan rápido debería borrar la máquina de escribir?

Haga clic aquí para ver la nueva versión.