This is a basic plugin for jQuery which adds an effect for slowly fading in text. There may be other plugins out there that have similar functionality, but this was an attempt to try building such a thing.

Demo

The Code

jQuery.fn.extend({
	typewrite: function(userArgs){

		var me = this;
		var args = {
			speed: 60,
			callback: false,
			fadeIn: true
		};
		if(typeof userArgs == 'number')
			args.speed = userArgs;
		else {
			args = jQuery.extend(args,userArgs);
		}


		var msg = me.text();
		if( ! msg )
			return false;

		// stop bump
		me.css('position','relative');
		me.html('<span style="z-index: 0; opacity: 0;">'+msg+'</span>');
		me.css('visibility','visible');
		me.prepend('<span id="typewriter-text" style="z-index: 50; position: absolute;"></span>');
		$tt = jQuery('#typewriter-text');

		msg = msg.split('');
		var letter;
		
		var typewriterInterval = window.setInterval(function(){
			if(msg.length) {
				letter = msg.shift();
				
				if(! args.fadeIn) {
					$tt.append(letter);
					return;
				}

				letter = '<span class="typewriter-fade-letter" style="display: none;">' + letter + '</span>';
				$tt.append(letter);
				$tt.find('.typewriter-fade-letter').last().fadeIn(300);
			} else {
				window.clearInterval(typewriterInterval);
				if(typeof args.callback == 'function')
					args.callback();
			}
		},args.speed);
	}
});