javascript5每秒改變字體顏色的大小

時間 2020-12-18

標籤 html dom 字體 spa code htm blog utf-8 get 欄目 JavaScript 简体版

原文原文鏈接

 1 <!DOCTYPE html>
 2 <html>
 3     <head>
 4         <meta charset="utf-8">
 5         <title></title>
 6         <style>
 7             #div1{width: 400px; height: 200px; background-color: white; border: 1px solid black; margin: 100px auto; text-align: center; line-height: 200px;
 8             font-size: 10px;}
 9         </style>
10         <script src="tool1.js"></script>
11         <script>
12             function randomColor(){
13                 var str="rgba("+parseInt(Math.random()*256)+","+parseInt(Math.random()*256)+","+parseInt(Math.random()*256)+",1)";
14                 return str;
15             }
16             window.onload=function(){
17                 var speed=5;//每一次變化的大小
18                 var count=0;//計數
19                 var oDiv=document.getElementById("div1");
20                 setInterval(function(){
21                     oDiv.style.color=randomColor();
22                     var iCur=parseInt(getStyle(oDiv,'fontSize'));//取出字體大小
23                     // alert(iCur);
24                     oDiv.style.fontSize=iCur+speed+'px';
25                     count++;
26                     if(count%6==0){
27                         speed*=-1;
28                     }
29                 },1000);
30             }
31             // alert(randomColor());
32         </script>
33     </head>
34     <body>
35         <div id="div1">
36             
37             我是div
38         </div>
39     </body>
40 </html>

相關標籤/搜索