Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript

Posted by Marius Furnica
Marius Furnica
9,195 Points

Second question about fader and SetInterval

Hey guys i have this code and is changing my paragraph once[fadeOut] and than continue fadeIn/fadeOut with second one.How can i change that after second paragraph the first will fadeIn and so on...

<div class="blog-news">
                        <h3>Blog News</h3>
                        <div class="blog-sect b-sect-1">
                             <div class="april april-1"><span>APR 01</span></div>
                             <p class="first-paragraph">Nice & clean.The best for you blog!</p>
                             <p>vitae tempus quam pellentesque nec nam aliquam sem et tortor</p>
                        </div>
                        <div class="blog-sect b-sect-2">
                              <div class="april april-2"><span>APR 01</span></div>
                              <p class="first-paragraph">What is an ecommerce theme!</p>
                              <p>vitae tempus quam pellentesque nec nam aliquam sem et tortor</p>
                        </div>
 </div>

var message1 = "What was the question?";
function fader() {
  $(".b-sect-1 p:first").fadeOut(3000, function() {
    $(this).html(message1).fadeIn(3000);
  });
}
fader();                    // run once now
setInterval(fader, 3000);

3 Answers

Steven Parker
Steven Parker
243,656 Points
Steven Parker
Steven Parker
243,656 Points

One paragraph, alternate between two messages?

var message1 = "What was the question?";
var message2 = "Nice &amp; clean.  The best for you blog!";
function fader() {
  $(".b-sect-1 p:first").fadeOut(3000, function() {
    $(this).html(message1).fadeIn(3000, function() {
      $(this).fadeOut(3000, function() {
        $(this).html(message2).fadeIn(3000);
      });
    });
  });
}
fader();
setInterval(fader, 12000); // <- note: total time
Marius Furnica
Marius Furnica
9,195 Points
Marius Furnica
Marius Furnica
9,195 Points

No is not my intention to alternate paragraphs let's say i have just one paragraph ,and that first code after p:first is faiding out and than the new message faiding in -- than new message faiding out and the old paragraph is faiding in again and so on Did you understand?

Marius Furnica
Marius Furnica
9,195 Points
Marius Furnica
Marius Furnica
9,195 Points

Yes exactly, sorry i didn't explain correctly. Thanks