基於jquery animate操作css樣式屬性小結_jquery

昨天突然有網友問我animate()方法可以來操作所有css屬性嗎？是的，我告訴他可以的。不過，在此有需要注意點需要大家搞清楚：當使用 animate()時，必須使用 Camel 標記法書寫所有的屬性名稱，比如，必須使用 paddingLeft 而不是 padding-left，使用 marginRight而不是 margin-right，等等。

css中的不是所有屬性都可以用Jquery動畫（animate函數）來動態改變，下面總結了JQ可以操作元素的一些屬性：

 * backgroundPosition  * borderWidth  * borderBottomWidth  * borderLeftWidth  * borderRightWidth  * borderTopWidth  * borderSpacing  * margin  * marginBottom  * marginLeft  * marginRight  * marginTop  * outlineWidth  * padding  * paddingBottom  * paddingLeft  * paddingRight  * paddingTop  * height  * width  * maxHeight  * maxWidth  * minHeight  * maxWidth  * font  * fontSize（在animate函數的css參數指定並不同於標準css屬性，例如這個css標準是：font-size。同理上面很多也是這樣的情況）  * bottom  * left  * right  * top  * letterSpacing  * wordSpacing  * lineHeight  * textIndent  * opacity

記住這些可以玩動畫的哦~~

jquery的animate()方法也可設定非css屬性

如題，舉例：

$('body').animate({scrollTop:0}, 1500);$("body").animate({scrollTop:"-="+50},350);

還有其他的幾個小例子：

禁用元素：

$('button').attr('disabled', 'disabled'); $('button').removeAttr('disabled');

遍曆元素集合：

$("input:text").each(function(index){   alert(index);//迴圈的下標值，從0開始   alert(this.value);//內建屬性可以用this(Dom)直接取值   alert($(this).attr("type"));//自訂屬性需要用attr()取值 });