码迷,mamicode.com
首页 > 其他好文 > 详细

简单动画

时间:2017-05-11 00:15:39      阅读:236      评论:0      收藏:0      [点我收藏+]

标签:charset   box   lan   back   tostring   turn   get   func   blog   

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基本包装类型</title>
<style type="text/css">
  .red{
      position: absolute;
         width: 100px;
         height: 100px;
         background: red;
     }

    .blue{ width: 100px;
        height: 100px;
        background: blue;

    }
#pox{
    width: 150px;
    height: 150px;
    background: orange;
    display: block;
}

</style>


    <link rel="stylesheet" href="">
    <!--script type="text/javascript" src="dowe3.js"></script-->
</head>
<body>






    <div id="box" class="red" style="width: 100px">测试Div</div>

<script>

    var box = document.getElementById(box);

    function yd() {
       var r=get();
       var g=get();
       var b=get();
       var color=#+r+g+b;
       box.style.backgroundColor=color;

       if(!box.style.left){
           box.style.left=1px;
       }else {
           var left = parseInt(box.style.left) + 1;
           //console.log();
           box.style.left = left + px;
       }
    }
function get() {
    return parseInt(Math.random()*256).toString(16);
}
    setInterval(yd, 100);


</script>


</body>
</html>

 

简单动画

标签:charset   box   lan   back   tostring   turn   get   func   blog   

原文地址:http://www.cnblogs.com/zgpeng/p/6838861.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!