基于jquery animate操作css樣式屬性小結(jié)
昨天突然有網(wǎng)友問我animate()方法可以來操作所有css屬性嗎?是的,我告訴他可以的。不過,在此有需要注意點(diǎn)需要大家搞清楚:當(dāng)使用 animate()時,必須使用 Camel 標(biāo)記法書寫所有的屬性名,比如,必須使用 paddingLeft 而不是 padding-left,使用 marginRight而不是 margin-right,等等。
css中的不是所有屬性都可以用Jquery動畫(animate函數(shù))來動態(tài)改變,下面總結(jié)了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函數(shù)的css參數(shù)指定并不同于標(biāo)準(zhǔn)css屬性,例如這個css標(biāo)準(zhǔn)是:font-size。同理上面很多也是這樣的情況) * bottom * left * right * top * letterSpacing * wordSpacing * lineHeight * textIndent * opacity
記住這些可以玩動畫的哦~~
jquery的animate()方法也可設(shè)置非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);//循環(huán)的下標(biāo)值,從0開始 alert(this.value);//自帶屬性可以用this(Dom)直接取值 alert($(this).attr("type"));//自定義屬性需要用attr()取值 });
相關(guān)文章
jQuery實(shí)現(xiàn)一個簡單的驗(yàn)證碼功能
今天給大家分享一個基于jquery實(shí)現(xiàn)的簡單驗(yàn)證碼功能,代碼簡單易懂,非常不錯,具有參考借鑒價值,需要的的朋友參考下吧2017-06-06Query常用DIV操作獲取和設(shè)置長度寬度的實(shí)現(xiàn)方法
下面小編就為大家?guī)硪黄猀uery常用DIV操作獲取和設(shè)置長度寬度的實(shí)現(xiàn)方法。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2016-09-09基于jQuery實(shí)現(xiàn)的仿百度首頁滑動選項卡效果代碼
這篇文章主要介紹了基于jQuery實(shí)現(xiàn)的仿百度首頁滑動選項卡效果代碼,涉及jQuery響應(yīng)鼠標(biāo)事件實(shí)現(xiàn)頁面元素動態(tài)變換的相關(guān)技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-11-11jquery.pagination.js 無刷新分頁實(shí)現(xiàn)步驟分享
jquery.pagination.js 無刷新分頁實(shí)現(xiàn)步驟分享,需要的朋友可以參考下2012-05-05