                        課程
                    
                        /前端開發
                        
                            /JavaScript
                        
                        /JS動畫效果

搞不懂哪里錯了。。。

help~

TAMJING

2015-07-29

源自：JS動畫效果 4-2

關注問題我要回答

1087

操作

收起

3 回答

Code_M0keny
2015-07-29

注意看line38

icur?=?Math.round(parseFloat(getStyle(obj.attr))*100);

obj.attr

目測是你這個參數搞錯了。應該是傳遞的兩個參數

所以應該是

icur?=?Math.round(parseFloat(getStyle(obj,?attr))*100);

1 回復有任何疑惑可以回復我~

收起回答

TAMJING 提問者

哈哈哈，后來我也發現，THX~

2015-07-29 回復有任何疑惑可以回復我~

TAMJING 提問者
2015-07-29

<!DOCTYPE?html>
<html?lang="en">
<head>
????<meta?charset="UTF-8">
????<title>自主封裝多功能動畫框架</title>
????<style>
?ul?li{
????????????width:?300px;;
????????????height:?200px;
????????????background:?pink;
????????????opacity:?0.3;
????????}
????</style>
????<script>
?window.onload?=?function(){
????????????//?test
?var?Li1?=?document.getElementById('li1');
????????????Li1.onmousemove?=?function(){
????????????????DIY_Animation(this,'opacity',100);
????????????}
????????????Li1.onmouseout?=?function(){
????????????????DIY_Animation(this,'opacity',30);
????????????}
????????}
????????//獲取對象obj的attr屬性
?function?getStyle(obj,attr){
????????????if(obj.currentStyle){??return?obj.currentStyle[attr];}//?有錯！
?else{??return?getComputedStyle(obj,false)[attr];}
????????}
????????//可以改變寬高、背景屬性、字號屬性、邊框屬性等等
????????//透明度(opacity)特殊處理，0~100為標準
//????????var?alpha=30;
?function?DIY_Animation(obj,attr,iTarget){?//obj=對象;attr=屬性;iTarget=改變的數值
?clearInterval(obj.timer);
????????????obj.timer?=?setInterval(function(){
????????????????var?icur?=?0;
????????????????if(attr?==?'opacity'){
????????????????????icur?=?Math.round(parseFloat(getStyle(obj.attr))*100);
????????????????}else{??icur?=?parseInt(getStyle(obj,attr));}
????????????????//獲取對象obj的attr屬性,parseInt()取整
?var?speed?=?(iTarget-icur)/8;
????????????????speed?=?speed>0?Math.ceil(speed):Math.floor(speed);
????????????????if(icur?==?iTarget){??clearInterval(obj.timer);}
????????????????else?{
????????????????????if?(attr?==?'opacity')?{
????????????????????????obj.style.filter?=?'alpha(opacity:'?+?(icur?+?speed)?+?')';
????????????????????????obj.style.opacity?=?(icur?+?speed)?/?100;
????????????????????}?else?{??obj.style[attr]?=?icur?+?speed?+?'px';}
????????????????}
????????????},30);
????????}
????</script>
</head>
<body>
<ul>
????<li?id="li1"></li>
</ul>
</body>
</html>

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

收起回答