簡易的運動框架可以用來控制長寬高、位置、透明度，結合定時器可以實現簡單的動畫。
其中最主要也是最基礎的就是獲得元素的屬性，我們先來看一下給元素新增樣式的三種方法：行內樣式、嵌入式樣式、外鏈樣式表
1我們要獲取元素的樣式可以使用 obj.style.xx,但是這個方法只能獲取行內樣式。doctype html
>
2<
html
lang
="en"
>
3<
head
>
4<
meta
charset
="utf-8"
>
5<
title
>document
title
>67
<
link
style
="stylesheet"
href
="style.css"
type
="text/css"
/>89
<
style
>
10div
13style
>
14head
>
15<
body
>
1617
<
div
style
="width:200px;"
>
div>
18body
>
19html
>
1所以我們要想獲得元素的樣式，style是不夠的所以引用了currentstyle（ie）方法和getcomputedstyle方法
定義乙個獲取元素樣式的通用函式：
1開始寫domove函式首先domove接受的引數function
getstyle(obj,attr);
1 domove(obj,attr,dir,target,endfn)obj是要進行操作的物件
attr是要操作的屬性
dir是要改變元素屬性的速度（在一段時間內改變多少）
target屬性改變的目標值
endfn是**函式
首先，我們先要判斷dir的正負，如果元素現在的屬性值要是小於目標值則attr為正，否則為負數
注意：用getstyle()函式返回的是字串，所以要用parseint轉換為數字
1 dir = parseint(getstyle(obj,attr)) < target ? dir : -dir;然後定義主要的運動函式
1 obj.timer = setinterval(functionspeed = 元素屬性當前的值 + 要每段時間的變化，判斷改變後的值speed是否大於或者小於目標值target，如果大於或者小於目標值，則speed等於目標值，否則繼續執行。();8 obj.style[attr] = speed + 'px';
9if(speed ==target);
13 },20);
如果speed等於目標值則停止對元素屬性的更改，清楚定時器，如果有**函式則執行。
最後定義對透明度改變的函式：
1基本思想和domove（）函式差不多。這裡就不在講了。function
chopacity(obj,speed,target,endfn)
22if(obj.style.opacity > 1)
27 },40);
2829 }
應用：
實現這個動畫效果的**：
domove函式
1function
domove(obj,attr,dir,target,endfn);
14 obj.style[attr] = speed + 'px';
15if(speed ==target);
19 },20);
20};
2122
function
chopacity(obj,speed,target,endfn)
43if(obj.style.opacity > 1)
48 },40);
4950}51
52function
getstyle(obj,attr);
js運動框架
第一次寫部落格希望諒解 js的運動框架其實就是對於元素的位置的改變 1 理解style和offsetstyle的區別 2 json和fon in的運用 3 數學知識的理解 4 對定時器的理解和運用 js function getstyle obj,name else 新增乙個函式引數讓能夠實現多個物...
彈性運動框架
彈性運動框架,多物體,單物體 9.彈性運動框架 title 8 meta name author content administrator 910 style 11 12 div1 13 line 14style 15head 16 body 17 div id div1 div 18 div i...
完美運動框架
1.勻速運動 1 2 param obj 待改變的物件 3 param json 待改變的屬性列表 4 return func 鏈式呼叫 5 6 functionstartmove obj,json,func else 25 26 勻速運動 27 var ispeed 10 28 29 if icu...