一起淡入两个div，但在不同的时间淡出它们

Question

我正在使用以下脚本，这是一个在“mytext”div中淡入和淡出的消息序列。

我需要“toptext”div在相同的时间用“test 1”淡入消息，然后保持在屏幕上并用“test 2”淡出OUT。

对不起，我是一个完全的初学者，所以很难搞清楚！任何帮助，真的很感激！

使用Javascript：

$(function(){
  $(window).mousemove(function(){
    runIt();
  });
  runIt();      
})

function runIt() {
  var it = $('#myText');
  it.stop(true,true).clearQueue().fadeOut(1).animate({left:0},500).queue(function(){
    it.html('Start Again');
    it.dequeue();
  })
  it.fadeIn(500).animate({left:0},5000).fadeOut(1000).queue(function(){
    it.html('test 1');
    it.dequeue();
  })
  it.fadeIn(1000).animate({left:0},5000).fadeOut(1000).queue(function(){
    it.html('test 2');
    it.dequeue();
  })
  it.fadeIn(1000).animate({left:0},5000).fadeOut(1000).queue(function(){
    it.html('test 3');
    $(window).unbind('mousemove');
    it.dequeue();
  })
  it.fadeIn(1000);
}

HTML：

<div id="toptext"></div>
<div id="myText"></div>

Answer 1

为什么不将它们包装在父div中。淡化父div，然后将每个子div淡出。