js实现动画(移动方块)

Posted 一笑任逍遥

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了js实现动画(移动方块)相关的知识,希望对你有一定的参考价值。

1、使方块移动

源码 :

<script type="text/javascript">
    var div = document.createElement(\'div\');
    document.body.appendChild(div);
    div.style.width = "100px";
    div.style.height = "100px";
    div.style.background = "red";
    div.style.position = "absolute";
    div.style.left =  "0px";
    div.style.top = "0px";

    //每隔50毫秒执行该函数。
    setInterval(function(){
        div.style.left = parseInt(div.style.left) + 5  + "px";
        div.style.top =  parseInt(div.style.top)  + 5  + "px";
    },50);
</script>

截图:

 

以上是关于js实现动画(移动方块)的主要内容,如果未能解决你的问题,请参考以下文章

js实现滚动效果

原生js实现放大镜效果

js实现一款俄罗斯方块

Android 中 View移动总结:ViewDragHelper学习及用法详解

iOS----四方块 动画button实现

JavaScript动画-碰撞检测