今天在學習使用jquery的動畫插件move.js，期間設想了一些使用情形，現在整理出來分享給大家。使用時一定多多注意哦！
Move#add(prop, val)
在這里val的值是一個不帶單位的阿拉伯數字，如：
move('.box1').add('margin-top', 50).end();
假如帶上了單位px會是什么樣子呢？結果就是這一條代碼無效，不過也不會報錯。如果代碼量很大，動畫又比較多的話，那就很難找到問題所在了。所以一定要注意哦！
元素的動畫如下三種寫法都是可以的哦！如：
寫法一：
move('.box1').add('margin-top', 50).end();
寫法二：
move(".box1").set("margin-left","200px").end(function(){
move(".box1").set("margin-left",0).end(function(){
move('.box1').add('margin-top', 50).end();
});
});
寫法三：
move(".box1")
.set("margin-left","200px")
.add('margin-top', 50)
.end();
那么寫法三可以像下面這樣寫嗎，把add改為set？
move(".box1")
.set("margin-left","200px")
.set('margin-top', "50px")
.end();
答案是肯定的，二者效果一致。不過此時記得給val帶上相應的單位哦。
如果set和add設置的屬性一致，比如都是margin-left呢？如：
第一種情形：
move(".box1")
.set("margin-left","200px")
.add('margin-left', 50)
.end();
結果是box1的margin-left值是50px，且是元素直接運動到margin-left:50px的位置?？刹皇?00+50=250哦。
第二種情形：
move(".box1")
.set("margin-left","200px")
.end(function(){
move('.box1').add('margin-left', 50).end();
});
box1會先運動到margin-left:200px的位置，稍作停頓再向右運動 50px，最終margin-left的值是200+50=250px。
不同寫法效果不同，一定不要混淆哦。
與Move#add(prop, val)違逆的是sub(prop, val)
這里的val也必須是一個數字。
用法與add一致。不同的是，以margin-left:50為例，add是向右運動50px，sub則是向左運動50px?？梢院唵蔚睦斫鉃?，相同的屬性和屬性值，add方法和sub方法運動軌跡相反。
Move#duration(n)設置動畫持續(xù)的時間，一定要有動畫才可以哦，不然就沒有持續(xù)的對象了。如果沒有動畫只設置duration，雖然不報錯，但是沒有任何意義。
先設置動畫還是先設置duration都可以哦，效果一致：
move(".box2").rotate(270).duration("10s").end();
move(".box2").duration("10s").rotate(270).end();
上面兩條代碼運行效果一致。
Move#translate(x[, y])
可以寫為** Move#to(x[, y])**。
使用時呢，可以接收1個參數，此時表示x軸移動的值；也可以接收2個參數，第一個參數表示X軸移動的值，第二個參數表示y軸移動的值。
如move(".box2").translate(200).end();僅僅水平向右運動200px；
而move(".box2").translate(400,400).end();水平向右運動400px的同時垂直向下運動400px；
如果向下面這樣寫會是什么效果呢？
move(".box2").translate(200).end();
move(".box2").translate(400,400).end();
結果是第一條代碼被覆蓋了，沒有效果；我們看到的是第二條代碼生效。
也許會有小伙伴說可能是運動太快肉眼沒看清才會錯以為第一條代碼沒有生效，那么我們可以給第一條代碼設置動畫持續(xù)時間看一下效果：
move(".box2").translate(200).duration("10s").end();
move(".box2").translate(400,400).end();
我們會看到根本沒有第一條代碼期望的運行10s的動畫過程。
Move#translate(x, y)也可以拆開為Move#translateX()和Move#translateY()，如：
move(".box2").translateX(100).translateY(100).end();
其運行效果和move(".box2").translate(100，100).end();一致。
有一點需注意，Move#translateX()、Move#translateY()的X\Y必須大寫，小寫會報錯。
其中，Move#translateX()可以寫為Move#x()，Move#translateY()可以寫為Move#y()。如
move(".box2").x(100).y(100).end();
一定要記得，Move#x()、Move#y()的x\y必須是小寫，大寫會報錯的。
Move#skew(x[, y])用法和Move#translate(x[, y])類似。
move(".box2").skew(50,50).end();和move(".box2").skewX(50).skewY(50).end();效果一致。
若Move#skew(x[, y])只有一個參數，則表示水平方向的斜切度數，垂直方向斜切度數默認為0.
Move#scale(x[, y])用法和Move#skew(x[, y])一致。
很重要的一點，Move#then([fn])和.pop()要配合使用。如果想要使用then()方法，下面的寫法是不會達到預期效果（先水平放大2倍，再垂直放大2倍）的：
move(".box2")
.scaleX(2)
.then()
.scaleY(2)
.end();
上面的代碼實際運行效果和move(".box2").scaleX(2).scaleY(2).end();一致，水平和垂直方向同時放大二倍。加上pop()就可以達到預期效果了，如下：
move(".box2")
.scaleX(2)
.then()
.scaleY(2)
.pop()
.end();
要注意，有幾個then()就要有幾個對應的pop()。
