javascript - 我主页上的三个绝对定位的小 div

Question

我的主页上有三个绝对定位的小 div。我只想一次出现一个 div，这样页面应该只从第一个 div 开始，3 秒后，第二个 div，3 秒后第三个 div，这个过程应该无限继续。这是我为执行此操作 10 次而想出的 for 循环。我怎样才能让同样的事情无限发生？

// this for not making infinite loop
var nb_loop=0;
var max_loop=10; 
var j=0;
for (var i=2; i<=3 ; i++){
  nb_loop++;
  j++;
  console.log("i="+i+", j="+j); // or alert if you want
  if (j>=3)
    j=0;
  if (i>=3)
    i=0;
  if (nb_loop>max_loop)
    break; 
}

Answer 1

JS:

var counter = 1;
function showDiv(){
$('.display').hide();
$('#div'+counter).show();
(counter == 4 ? counter = 1 : counter++)
}

showDiv();
var timer = setInterval(showDiv, 3000);

HTML:

 <div id='container'>
   <div id='div1' class='display' style="background-color: red;"> 
        div1
   </div>

    <div id='div2' class='display' style="background-color: green;"> 
       div2
    </div>

    <div id='div3' class='display' style="background-color: blue;"> 
       div3
    </div>

     <div id='div4' class='display' style="background-color: yellow;"> 
       div4
     </div>
 </div>

CSS:

 .display { display: none; }

使用 Jquery setInterval 函数无限时间使用