Javascript使文本逐字母淡入,然后淡出

我正在创建一个网站,一进入该网站,我希望一个句子在一个字母一个字母的消失,并在一段时间后,作为一个完整的句子消失。我有一些代码,使字母出现字母,但我需要他们“淡入”而不是仅仅出现。然后,一旦整个句子显示出来,它就会立即消失,不再重复。我还需要在CSS中引用这一点。

var showText = function (target, message, index, interval) {    
  if (index < message.length) { 
    $(target).append(message[index++]); 
    setTimeout(function () { showText(target, message, index, interval); }, interval); 
  } 
}

$(function () { 
   showText("#msg", "Hello, World!", 0, 500);    
});

http://jsfiddle.net/VZvK7/

谢谢你的帮助!!!