标签:play text time get back nts abs int cti
全部由js动态生成结点,body内无内容
<style> #count{ position: absolute; text-align: center; width: 240px; height: 260px; top: 230px; left: 750px; margin: 0; border: 10px black solid; border-radius: 240px; font-size: 200px; } .block{ background: red;width: 50px; height: 50px; display: inline-block; margin-left: 15px; position: absolute; top: 20px; left: 0; } </style> <body></body> <script> var oBody=document.getElementsByTagName(‘body‘)[0]; function countDown() { oBody.innerHTML=‘<div id="count">3</div>‘; var oDiv=document.getElementById(‘count‘); oDiv.timer=setInterval(function () { oDiv.innerText=parseInt(oDiv.innerText)-1; if (oDiv.innerText==0) { clearInterval(oDiv.timer); show(); //调用show()方法 } },1000); } countDown(); function show() { //动态生成n个小方块 oBody.innerText=‘‘; for (var i=0;i<23;i++){ oBody.innerHTML+="<div class=‘block‘ style=‘top: 20px;left:"+i*70+"px;‘></div>" } var timer=null; var num=0; var aDiv=document.getElementsByTagName("div"); timer=setInterval(function () { drop(aDiv[num]); num++; if (num===aDiv.length){ clearInterval(timer); } },100); } function drop(obj) { //把当前小方块向下掉 obj.timer=setInterval(function () { obj.style.top=parseInt(obj.style.top)+50+‘px‘; if (parseInt(obj.style.top)>800){ obj.style.top=800+‘px‘; clearInterval(obj.timer); } },50); } </script>
标签:play text time get back nts abs int cti
原文地址:https://www.cnblogs.com/renqiaoqiao/p/11567192.html