我想用json来同时动画的运动，但是为什么不行？
<!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>
</head>
<style type="text/css">
*{margin:0;padding:0}
ul li{list-style:none}
ul li{margin-bottom:20px;background:#06F;height:100px;width:100px;filter:alpha(opacity:60);opacity:0.6;border:2px solid #CCC}
</style>
<script type="text/javascript">
window.onload=function(){
var ul=document.getElementsByTagName('ul')[0];
var li=ul.getElementsByTagName('li');
for(i=0;i<li.length;i++){
li[i].timer=null;
li[i].onmouseover=function(){
var This=this;
startfun(this,{width:200,opacity:100}/*,function(){
startfun(This,100,'opacity');
}*/);
}
li[i].onmouseout=function(){
var This=this;
startfun(this,{width:100,opacity:60}/*,function(){
startfun(This,100,'width');
}*/);
}
}
var alpha=60;
function startfun(obj,json){
for(var arrt in json){
clearInterval(obj.timer);
obj.timer=setInterval(function(){
if(arrt=='opacity'){
var icu=Math.round(parseFloat(getstyle(obj,arrt))*100);
}
else{
var icu=parseInt(getstyle(obj,arrt));
}
var speed=(json[arrt]-icu)/10;
speed=speed>0?Math.ceil(speed):Math.floor(speed);
if(json[arrt]==icu){
clearInterval(obj.timer);
/*if(fun){
fun();
}*/
}
else{
if(arrt=='opacity')
{
obj.style.filter='alpha(opacity:'+(icu+speed)+')';
obj.style.opacity=(icu+speed)/100
}
else{
obj.style.width=icu+speed+"px";
}
}
},30)
}
}}
function getstyle(obj,arrt){
if(obj.currentStlye){
return obj.currentStyle[arrt];
}
else{
return getComputedStyle(obj,false)[arrt];
}
}
</script>
<body>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</body>
</html>
杭州程序员张张
相关分类