为了账号安全,请及时绑定邮箱和手机立即绑定

您好 请问我的代码可以执行,但是move函数里边的函数参数不执行是怎么回事。



<!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>

*{

margin:0;

padding:0;

}

#main{

width:300px;

height:300px;

position:relative;

    margin:0 auto;

background:#09C;

border-radius:10px;


}

#main #circle{

width:200px;

height:200px;

background:#F3C;

border-radius:50%;

position:absolute;

left:50px;

top:50px;

}

#main a{

width:100px;

height:50px;

background:#0FC;

border-radius:10px;

display:block;

color:white;

text-decoration:none;

text-align:center;

line-height:50px;

position:absolute;

left:100px;

bottom:0;

}

</style>

<script>

   window.onload=function(){

   var link=document.getElementById("link");

   var cir=document.getElementById("circle");

   var flag=true;

   link.onmouseover=function(){

   move(cir,{top:-50,opacity:0},function(){

   move(cir,{top:50,opacity:100})

   

   })

   }

   }

   

   

   

    function move(obj,json,fn) {

                  clearInterval(obj.timer);

 


                  obj.timer=setInterval(function () {

  

   for(var attr in json){

 

                      var cur=0;

                      if(attr=='opacity'){

                          cur=parseFloat(getstyle(obj,attr))*100;

                      }

                      else{

                           cur=parseInt(getstyle(obj,attr));

                      }


                      var speed=(json[attr]-cur)/8;

                      speed=speed>0?Math.ceil(speed):Math.floor(speed);

                      if(cur!==json[attr]){

  

  flag=false;

                         

                      }

                       if(attr=='opacity'){

                              obj.style.filter='alpha(opacity:'+(cur+speed)+')';

                              obj.style.opacity=(cur+speed)/100

                        }

else{

  obj.style[attr]=cur+speed+"px";

}

                        if(flag){

  clearInterval(obj.timer);

  if(fn){

  fn();

  }

}

                      

   

  }

  

 

                  },30)

            }

            function getstyle(obj,attr) {

                if(obj.currentStyle){

                    return obj.currentStyle[attr]

                }

                else{

                    return getComputedStyle(obj,false)[attr];

                }


            }

</script>

</head>


<body>

<div id="main">

   <div id="circle"></div>

   <a href="#" id="link">来回</a>

</div>

</body>

</html>


正在回答

1 回答

window.onload=function(){    
  var link=document.getElementById("link");
  var cir=document.getElementById("circle");
  link.onmouseover=function(){
    move(cir,{width:100,opacity:0},function(){
        move(cir,{top:50,opacity:100});
    });
  };
};
function move(obj,json,fn) {
   clearInterval(obj.timer);
   obj.timer=setInterval(function () {
       for(var attr in json){
      var flag=true;
      var cur=0;
      if(attr=='opacity'){
          cur=Math.round(parseFloat(getstyle(obj,attr))*100);
      }else{
        cur=parseInt(getstyle(obj,attr));
      }
      var speed=(json[attr]-cur)/8;
      speed=speed>0?Math.ceil(speed):Math.floor(speed);
      if(cur!==json[attr]){
          flag=false;        
      }
      if(attr=='opacity'){
          obj.style.filter='alpha(opacity:'+(cur+speed)+')';
        obj.style.opacity=(cur+speed)/100;
      }else{
        obj.style[attr]=cur+speed+"px";
      }
    }
    if(flag){
        clearInterval(obj.timer);
      if(fn){
          fn();
      }
    }
  },30);
}


0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

您好 请问我的代码可以执行,但是move函数里边的函数参数不执行是怎么回事。

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信