CODEWITHSUNDEEP
javascriptjquerysetintervalfadeinfadeout
user3159369
user3159369

Reputation: 35

Jquery fadeIn in callback for fadeOut not lasting

Hope someone can shed some light on this issue for me.... I'm using a setInterval to alternate displaying headlines on a webpage. it fades out the previous one, then in the callback function fades in the new one. it used to work fine, however I separated the callback function from the fadeOut because I wanted to run it initially without a delay, and now I'm getting the initial headline, however when it comes time to change, they fade in for a split second and disappear again.

       function processSidebar(data) {
            var headlines = $.parseJSON(data);
            var sIndex = 0;

            function newSidebar(surl, sIndex) {
                $(".sidebar").html(headlines[sIndex].date + '<br><a href="' + surl + '">' + headlines[sIndex].line + '</a>');
                $(".sidebar").fadeIn(400);
            }
            newSidebar("getme.php?blog=1&headline=1", sIndex);

            setInterval(function() {
                ++sIndex;
                if (sIndex == headlines.length) {sIndex = 0}
                var surl="getme.php?blog=1&headline=" + headlines[sIndex].index;
                $(".sidebar").fadeOut(400,newSidebar(surl,sIndex));
            }, 10000); // end setInterval

        }; // end processSidebar

Upvotes: 0

Views: 57

Answers (1)

Othi
Othi

Reputation: 356

jQuery's fadeOut wants a function as the complete argument.

You're giving newSidebar(surl,sIndex), which gets evaluated immediately and returns nothing (but does the whole fadeIn stuff).

You want to use an anonymous function:

$(".sidebar").fadeOut(400,function() { newSidebar(surl,sIndex) });

Upvotes: 1

Related Questions