js自动缩放 

 1 <!DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>js自动缩放</title>
 6 </head>
 7 <script>
 8     window.onload = function () {
 9         var num = 16;
10         var s = 20;
11         setInterval(function () {
12             num = num + s;
13             if (num>=116){
14                 s*=-1;
15             }else if (num<=16){
16                 s = 20;
17             }
18             //console.log(num);
19             var color = "rgba(" + Math.round(Math.random() * 255) +"," +Math.round(Math.random() * 255) + "," +Math.round(Math.random() * 255) +",1)";
20             console.log(color);
21             var div = document.getElementById("div");
22 
23             //div.style.color=color;
24             div.style.backgroundColor=color;
25             div.style.fontSize=num+"px";
26         }, 500);
27     }
28 </script>
29 <style>
30     #div{
31         width: 1200px;height: 800px;background: red;text-align: center;line-height: 800px;margin: 0 auto;
32     }
33 </style>
34 <body>
35     <div id="div">js自动缩放</div>
36 </body>
37 </html>

 

posted @ 2017-08-16 10:31  宋发元  阅读(384)  评论(0)    收藏  举报