Question

How would i go about make two divs fade in/out alternating between the two, so that only one is visible at a time? And also make it in a never ending loop?

Thanks in advance!!

I know it should be done with the .fadeOut and .fadeIn – but not sure how to make it loop over and over again.

Answer 1

Here’s my own version a la fiddle

http://jsfiddle.net/3KydB/

window.switchIn = function () {
    $('.red').fadeToggle(function() {
        $('.blue').fadeToggle(function() {
            setTimeout(function() {window.switchOut();}, 500);
        });
    });

}

window.switchOut = function () {
    $('.blue').fadeToggle(function() {
        $('.red').fadeToggle(function() {
            setTimeout(function() {window.switchIn();}, 500);
        });
    });

}

setTimeout(function() {window.switchIn();}, 500)