js动画脚本编写原理 最简单的那种

用到了透明度 做的时候发现 透明度的调节 需要指定宽高，要不然透明度的数值就无效了。

<!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=gb2312" />
<title>无标题文档</title>
<script language="javascript">
window.onload = function()
{
	var k = document.getElementById("k");
	k.onmouseover = function()
	{
		clearInterval(this.goObj);
		this.style.opacity=1;
		this.style.filter="alpha(opacity=100)";
	};
	k.onmouseout = function()
	{
		this.style.opacity=1;
		this.style.filter="alpha(opacity=100)";
		this.iOpacity = 1;
		goMove(this);
	};
};
function goMove(obj)
{
	obj.goObj = setInterval(function()
	{
		obj.iOpacity -= 0.01;
		obj.style.opacity=obj.iOpacity;
		obj.style.filter="alpha(opacity="+obj.iOpacity*100+")";
		if(obj.iOpacity < 0)
		{
			clearInterval(obj.goObj);
		}
	}
	,10);
}
</script>
</head>

<body>
<div id="k" style="background-color:#333333; height:300px; width:700px;"></div>
</body>
</html>

 

posted @ 2012-01-11 15:19  彭成刚  阅读(371)  评论(0)  编辑  收藏  举报