ちょうきょう666

导航

javascript5每秒改变字体颜色的大小 

 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>

 

posted on 2020-12-18 14:19  ちょうきょう666  阅读(252)  评论(0)    收藏  举报