问jQuery fadeIn()，fadeOut() 2文本

EN

<div>
    <div class='fadey'>1</div>
    <div class='fadey'>2</div>
    <div class='fadey'>3</div>
</div>

var faderIndex = 0, //to keep track
    faders = $('.fadey'); //cache, so we won't have to walk the dom every time

function nextFade() {

    //fade out element over 1000 milliseconds, after which call a function
    $(faders[faderIndex]).fadeOut(1000, function() {

        //increase the index and do a check, so we won't overflow
        faderIndex++;
        if (faderIndex >= faders.length)
            faderIndex = 0;

        //fade in the next element, after which call yourself infinitely
        $(faders[faderIndex]).fadeIn(1000, nextFade);
    });
}
//get the ball rolling
nextFade();

<span class="rotateText">Test</span>
<div class="rotateArray">
    <a href="http://www.google.com">Google.com</a>
    <a href="http://www.microsoft.com">Microsoft.com</a>
    <a href="http://stackoverflow.com">Stackoverflow.com</a>
    <a href="http://www.wired.com">Wired.com</a>
</div>

   $(function () {
        // set first
        $('.rotateText').html($('.rotateArray a').eq(0));
        // enter loop
        rotateText();
    });

    function rotateText() {         
        var count = $('.rotateArray a').length;
        var i = 0;
        var loopArr = $('.rotateArray a');
        var rotationElm = $('.rotateText');
        window.setInterval(function () {
            rotationElm
                    .fadeOut(400)
                    .queue(function () {
                        $(this).html('<a href="' + loopArr.eq(i).attr('href') + '">' + loopArr.eq(i).text() + '</a>');
                        if (++i == count) i = 0;                           
                        $(this).dequeue();
                    })
                    .fadeIn(400)
                    ;
        }, 4000);

    }

$('#foo').fadeOut(500, function() {
  $(this).html('<span>Bar</span>');
  $(this).fadeIn(500);
});