あとで詳しく書くとして、ひとまずメモ
javascript(jqueryもちょっと使ってる)
HTML
javascript(jqueryもちょっと使ってる)
<script>var timer;var n = 0;function startInterval() { // setInterval(実行する関数名, ミリ秒)timer = setInterval(example, 1000);}function example() {n++;document.getElementById("text").innerHTML = n;$(function(){if(n>5){$(".box1").slideDown();} //5秒後if(n>39){$(".box2").slideDown();} //39秒後if(n>50){$(".box3").slideDown();} //50秒後if(n>65){$(".box4").slideDown();} //65秒後if(n>80){$(".box5").slideDown();} //80秒後if(n>95){$(".box6").slideDown();} //95秒後if(n>115){$(".box7").slideDown();} //115秒後})}function stopInterval() { // setIntervalの停止clearInterval(timer);n = 0;document.getElementById("text").innerHTML = n;}</script>
HTML
<div onclick="startInterval();">クリックしてスタート!</div>
<div onclick="stopInterval();">ストップ</div>
<div class="box1">メッセージ1</div>
<div class="box2">メッセージ1</div>
<div class="box3">メッセージ1</div>
<div class="box4">メッセージ1</div>
<div class="box5">メッセージ1</div>
<div class="box6">メッセージ1</div>
<div class="box7">メッセージ1</div>