標籤雲

Android (59) ActionScript (52) PHP (14) JavaScript (11) 設計模式 (10) CSS與Html (8) Flex (7) Material Design (6) frameworks (5) 工具 (5) 串流影音 (4) 通用 (4) DB (3) FlashRemoting (3) Java (3) SQL (3) Mac 操作 (2) OpenGL ES (2) PureMVC (2) React Native (2) jQuery (2) AOSP (1) Gradle (1) XML (1) 軟體設定 (1)

搜尋此網誌

顯示具有 jQuery 標籤的文章。 顯示所有文章
顯示具有 jQuery 標籤的文章。 顯示所有文章

2009/11/10

jQuery-動畫效果

分類方法說明
基本.show()可傳入
'fast'(0.2秒)、'normal'(0.4秒)、'slow'(0.6秒)或毫秒數
第二個參數可傳入 callback
.hide()
.toggle()可傳入 boolean 值,或速度與 callback
滑動.slideDown(speed)可傳入
'fast'(0.2秒)、'normal'(0.4秒)、'slow'(0.6秒)或毫秒數
第二個參數可傳入 callback
.slideUp(speed)
.slideToggle(speed)
淡入淡出.fadeIn(speed)可傳入
'fast'(0.2秒)、'normal'(0.4秒)、'slow'(0.6秒)或毫秒數
第二個參數可傳入 callback
.fadeOut(speed)
.fadeTo(speed, opacity)傳入速度, 透明度(第三參數為 callback)
自訂動畫.animate()參數為( params, [duration], [easing], [callback] )
easing 除了"linear"跟"swing"外,都需要 plugin
例:$("#block").animate({width:"70%", opacity:0.4, fontSize:"3em"}, 1500);
.stop([clearQueue], [gotoEnd])停止動畫
設定指令jQuery.fx.off設為 true 則 disable 所有動畫


分類方法說明
佇列
(可與動畫串接)
.queue()將非效果的方法也排入佇列
傳入 callback 則為在佇列結尾附加 callback
若已存在佇列,傳入新佇列會取代舊佇列
.dequeue()執行佇列中的下一個動畫
(若沒有在 queue 後面執行 dequeue 則動畫會停止)

2009/11/09

jQuery-選擇器

有鑑於每次要用 jQuery 的時候都要重新翻書確定一下用法
所以乾脆還是把一些要用的資訊整理一下好了

選擇器 (Selector):

分類選擇器意義
CSS 選擇器標籤名稱文件中所有該標籤的元素(element)
#id
.class
,用來結合不同條件
子元素組合運算子a>b 或 a ba 的子元素 b
a+b緊接 a 元素的 b 元素
例:$('tr + td')
a~b與 a 在同一層的 b 元素
例:$('#myDiv ~ div')
屬性選擇器
(支援正規表示式)
[]屬性篩選
^ 字串首
$ 字串尾
* 任意字
! 反向
例:$('a[href^=mailto:]')
$('a[href$=.pdf]')
自定選擇器:eq(index)索引值
:gt(index)索引值後
:lt(index)索引值前
:visible可視元素
:hidden隱藏的元素
:first第一個元素
:last最後一個元素
:odd()奇數
:even()偶數
:has(selector)
:not(selector)不含
:empty無子元素
:contains(text)含有指定文字
:header<h1>到<h6>
:animated正在動畫中的元素
子元素選擇器:child(formula)公式的形式為 a*n+b
:parent父元素
:first-child第一個子元素
:last-child最後一個子元素
:only-child在父元素下是唯一的子元素
:nth-child(index/even/odd/equation)父元素的第index(從 1 開始)個子代元素
:nth-父元素的子代元素
表單選擇器:text
:checkbox
:radio
:image
:submit
:reset
:file
 
:inputinput, textarea, select, button 等元素
:buttonButton 元素及具有 type 屬性的 input 元素
:enabled作用中的表單元素
:disabled禁用中的表單元素
:checked被核取的radio button 和 checkbox
:selected被選到的下拉選單 option


或是參考官方的 doc
http://docs.jquery.com/Selectors