// JavaScript Document
window.onload=function(){
?var Li1=document.getElementById('li1');
???? Li2=document.getElementById('li2');
?Li1.onmouseover=function(){
??Move(Li1,{width:400,height:200,opacity:100},function(){
???Move(Li1,{width:200,height:150,opacity:70});
???})
??}
?Li1.onmouseout=function(){
??Move(Li1,{width:200,height:100,opacity:30})
??}
?Li2.onmouseover=function(){
??Move(Li2,{width:400,height:200,opacity:100})
??}
?Li2.onmouseout=function(){
??Move(Li2,{width:200,height:100,opacity:30})
??}
?}
?function Move(obj,json,fn){
??clearInterval(obj.timer);
??obj.timer=setInterval(function(){
???var flag=true;//假設所有運動都達到目標值
???for(var attr in json)//獲取當前值
???{
???
???var icor=0
???if(attr=='opacity'){
????icor=Math.round(parseFloat(getStyle(obj,attr))*100);
????}
???else{
????icor=parseInt(getStyle(obj,attr));
????}
???var speed=(json[attr]-icor)/10;
???speed=speed>0?speed=Math.ceil(speed):speed=Math.floor(speed);
???if(icor!=json[attr]){
????flag=false;
???????? } //對flag真假的定義 假的，繼續(xù)執(zhí)行以上函數(shù)。
???if(attr=='opacity'){
????obj.style.filter='alpha(opacity:'+(icor+speed)+')';
????obj.style.opacity=(icor+speed)/100;
?????}
???else{
????obj.style[attr]=icor+speed+'px';
?????}
??????? }//json for結束
???if(flag){
????clearInterval(obj.timer)
????if(fn){
?????fn();
?????}
????}//若flag為真
???},50)}
?function getStyle(obj,attr){
??if(obj.currentStyle){
???return obj.currentStyle[attr];
???}
??else{
???return getComputedStyle(obj,false)[attr];
???}
??}