JS
PHP
HTML5
CSS3
jQuery
SQL
BootStrap5
Other
其他 字符串 数组 正则 存储 表单 数据库 选择器 屏幕 历史 时间 数学 元素 节点 属性 窗口 地址 动画 棋子 查找 排序 全局 JSON 浏览器 数据类型
其他 字符串 数组 正则 存储 表单 数据库 选择器 屏幕 历史 时间 数学 元素 节点 属性 窗口 地址 动画 棋子 查找 排序 全局 JSON 浏览器 数据类型
js动画
<meta charset="utf-8">
<style>
#div1 {
width: 200px;
height: 200px;
position: relative;
background: yellow;
}
#div2 {
width: 50px;
height: 50px;
position: absolute;
background-color: red;
}
</style>
<button onclick="myMove()">点我</button>
<div id ="div1">
<div id ="div2">
</div>
</div>
<script>
function myMove() {
var pos = 0;
var clock2 = setInterval(function(){
if (150 == pos) {
clearInterval(clock2);
}
else {
pos++;
div2.style.top = pos + 'px';
div2.style.left = pos + 'px';
}
}, 20);
}
</script>
运行结果