jQuery Animation How to - Fade in one statement over another indefinitely








Question

We would like to know how to fade in one statement over another indefinitely.

Answer


<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<div class="background">
  <h6>
    <div id="one">This is the first statement</div>
    <div id="two">This is the second statement</div>
    <div id="third">You get the point</div>
  </h6><!--  www  .  j av  a  2 s .c  o  m-->
</div>
<script>
var k = ["#one","#two","#third"]
var cnt = 0;
setInterval(function(){
    $(k[cnt]).fadeToggle('slow').siblings().hide();
    cnt++;
    if(cnt ==3){
       cnt = 0;
    }
},2000);
</script>

The code above is rendered as follows: