文字轮播交叉淡入淡出效果？

我们正在尝试实现一个简单的文本轮播，用几个其他单词替换句子中的单个单词。它们将淡入/淡出，容器宽度应缩小/放大以容纳新单词。听起来很简单，但我们遇到了困难。

应该像第二行一样工作www.branch.com http://www.branch.com.

找不到这个插件？图像轮播当然可以，但文本不能，也不能更改前一容器。

它会遍历单词，但容器需要更改宽度。

    $('#caption p:gt(0)').hide();
    setInterval(function() {
        $('#caption span:first-child').fadeOut('slow')
           .next('span').fadeIn('slow')
           .end().appendTo('#caption');
    }, 2000);

这是

 <div id="caption">
      <span>best</span>
      <span>ultimate</span>
      <span>excellent</span>
      <span>fantastic</span>
   </div>

镇上的网站。

#container {
   position: relative;
}

#container p {
   position: absolute; 
   top: 0; 
   left: 0;
}

有什么建议么？

我希望这能解决问题http://jsfiddle.net/JVuEv/ http://jsfiddle.net/JVuEv/

function ticker() {
    var caption = $('#caption');
    var elements = caption.children();
    $(elements[0]).fadeOut('slow', function () {
        caption.append($(this));
        $(elements[1]).show();
    });
}