                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JS动画效果

getStyle(obj,attr)

为啥我的动画不出来

qq_MissingYou_0

2017-02-18

源自：JS动画效果 4-2

关注问题我要回答

3375

操作

收起

3 回答

尹为者回答被采纳 +3 积分
2017-02-18

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
</head>

<body>
<style>
*{
    margin:0;
    padding:0;

    }
div{
      width:200px;
      height:200px;
      background:red;
      border:4px solid black;
      }
</style>
<script>
window.onload=function(){
     var odiv=document.getElementById("div1");
     odiv.onmouseover=function(){
         startMove();
         }
    }

     var timer=null;
     function startMove(){
         clearInterval(timer);
        var odiv=document.getElementById("div1");
         timer=setInterval(function(){
             if(odiv.offsetWidth==0){
              clearInterval(timer);
             }else{
                // odiv.style.width=odiv.offsetWidth-9+'px';
                odiv.style.width=parseInt(getStyle(odiv,"width"))-1+'px';
                 }
             },30)}
    function getStyle(obj,attr){
         if(obj.currentStyle){
             return obj.currentStyle[attr];
             }else{
             return getComputedStyle(obj,false)[attr];
                 }
        }
</script>
</head>

<body>
<div id="div1" ></div>
</body>
</html>

以上，你的错误好多啊，自己对比吧

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

收起回答

qq_MissingYou_0 提问者

？代码都是一样的啊

2017-02-18 回复有任何疑惑可以回复我~

qq_MissingYou_0 提问者

你的style 和script 都在body里面

2017-02-18 回复有任何疑惑可以回复我~

尹为者回复 qq_MissingYou_0 提问者

我也是初学者，遇到问题不可怕，慢慢来总是能找到，我已经给你正确的了，本来希望你试着自己找出来不一样的地方，我也是找了十多分钟才找到的， odiv.style.width=parseInt(getStyle(odiv,"width"))-1+'px'; return getComputedStyle(obj,false)[attr]; 这两句改了，毕竟过了一天了，参考下

2017-02-19 回复有任何疑惑可以回复我~

查看2条回复

慕无忌4172087
2020-03-23

odiv.style.width=parseInt(getStyle(odiv,width))-1+'px';你的width没有加引号

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

收起回答

尹为者
2017-02-18

window.onload=function(){
   var odiv=document.getElementById("div1");
   alert(odiv.stye.width);-----style
   odiv.onmouseover=function(){
       startMove();