javascript简单的动画效果
文章来源：365jz.com 点击数：
274 更新时间：2009-09-19 10:22
参与评论
Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
.box{border:#C90 1px solid;width:200px;height:20px; margin:0 auto; position:relative;}
.movebox{width:20px;height:20px; background:#9C0; overflow:hidden; position:absolute;left:0}
</style>
</head>
<body onload="moves()">
<div class="box" id="box">
<div class="movebox" id="movebox"></div>
</div>
<script>
var $ = function(id){ return document.getElementById(id)}
$("movebox").style.position = 'absolute';
$("movebox").style.left = 0;
function moves(){
var ypos = parseInt($("movebox").style.left) ;
if(ypos < 180){
ypos++;
}
$("movebox").style.left = ypos + 'px';
setTimeout(moves,10);
}
</script>
</body>
</html>代码写的不好,有看的朋友欢迎指出问题,谢谢
Tag标签: javascript动画效果
如对本文有疑问，请提交到交流论坛，广大热心网友会为你解答！！ 点击进入论坛
------分隔线----------------------------
