-
toggle、sildeToggle以及fadeToggle的區(qū)別:
toggle:切換顯示與隱藏效果
sildeToggle:切換上下拉卷滾效果
fadeToggle:切換淡入淡出效果
當(dāng)然細節(jié)上還是有更多的不同點:
toggle與slideToggle細節(jié)區(qū)別:toggle:動態(tài)效果為從右至左。橫向動作,toggle通過display來判斷切換所有匹配元素的可見性
slideToggle:動態(tài)效果從下至上。豎向動作,slideToggle 通過高度變化來切換所有匹配元素的可見性
fadeToggle方法
fadeToggle() 方法在 fadeIn() 和 fadeOut() 方法之間切換。
元素是淡出顯示的,fadeToggle() 會使用淡入效果顯示它們。
元素是淡入顯示的,fadeToggle() 會使用淡出效果顯示它們。
注釋:隱藏的元素不會被完全顯示(不再影響頁面的布局)
查看全部 -
注意事項:
下拉動畫是從無到有,所以一開始元素是需要先隱藏起來的,可以設(shè)置display:none
如 果提供回調(diào)函數(shù)參數(shù),callback會在動畫完成的時候調(diào)用。將不同的動畫串聯(lián)在一起按順序排列執(zhí)行是非常有用的。這個回調(diào)函數(shù)不設(shè)置任何參數(shù),但是 this會設(shè)成將要執(zhí)行動畫的那個DOM元素,如果多個元素一起做動畫效果,那么要非常注意,回調(diào)函數(shù)會在每一個元素執(zhí)行完動畫后都執(zhí)行一次,而不是這組 動畫整體才執(zhí)行一次
查看全部 -
注意事項:
show與hide方法是修改的display屬性,通過是visibility屬性布局需要通過css方法單獨設(shè)置
如果使用!important在你的樣式中,比如display: none !important,如果你希望.show()方法正常工作,必須使用.css('display', 'block !important')重寫樣式
如果讓show與hide成為一個動畫,那么默認執(zhí)行動畫會改變元素的高度,高度,透明度
?
查看全部 -
語法:參數(shù)接受一個jQuery或者dom對象作為查找的條件
.index()
.index(selector)
.index(element)
如果不傳遞任何參數(shù)給.index()方法,則返回值就是jQuery對象中第一個元素相對于它同輩元素的位置
如果在一組元素上調(diào)用.index(),并且參數(shù)是一個DOM元素或jQuery對象,index()返回值就是傳入的元素相對于原先集合的位置
如果參數(shù)是一個選擇器,index()返回值就是原先元素相對于選擇器匹配元素的位置。如果找不到匹配的元素,則.index()返回-1
查看全部 -
語法
.get([index])
注意兩點
get方法是獲取的dom對象,也就是通過document.getElementById獲取的對象
get方法是從0開始索引
所以第二個a元素的查找:$(a).get(1)
負索引值參數(shù)
get方法還可以從后往前索引,傳遞一個負索引值,注意的負值的索引起始值是-1
同樣是找到第二個元素,可以傳遞$(a).get(-2)
查看全部 -
jQuery.trim()函數(shù)用于去除字符串兩端的空白字符
這個函數(shù)很簡單,沒有多余的參數(shù)用法
需要注意:
移除字符串開始和結(jié)尾處的所有換行符,空格(包括連續(xù)的空格)和制表符(tab)
如果這些空白字符在字符串中間時,它們將被保留,不會被移除
查看全部 -
語法
jQuery.inArray(value,array.[gromIndex])
注意:
如果要判斷數(shù)組中是否存在指定值,你需要通過該函數(shù)的返回值不等于(或大于)-1來進行判斷
查看全部 -
語法
jQuery.each(array,callback)
jQuery.each(object,callback)
第一個參數(shù)傳遞的就是一個對象或者數(shù)組,第二個是回調(diào)函數(shù)
查看全部 -
基本語法
.stop();停止當(dāng)前動畫,點擊在暫停處繼續(xù)開始
.stop(true)如果同一個元素調(diào)用多個動畫方法,尚未被執(zhí)行的動畫被放置在元素的效果隊列中。這些動畫不會開始,知道第一個完成。當(dāng)調(diào)用.stop()的時候,隊列中的下一個動畫立即開始。如果clearQueue參數(shù)提供true值,那么在隊列中的動畫其余被刪除并永遠不會運行
.stop(true,true);當(dāng)前動畫將停止,但該元素上的css屬性會被立刻修改成動畫的目標值
stop():只會停止第一個動畫,第二個第三個繼續(xù)
stop(true):停止第一個、第二個和第三個動畫
stop(true true):停止動畫,直接跳到第一個動畫的最終狀態(tài)
查看全部 -
option參數(shù):
duration-設(shè)置動畫執(zhí)行的時間
easing-規(guī)定要用的easing函數(shù),過渡使用哪種緩動函數(shù)
step-規(guī)定每個動畫的每一步完成之后要執(zhí)行的函數(shù)
progress:每一次動畫調(diào)用的時候會執(zhí)行這個回調(diào),就是一個進度的概念
complete:動畫完成回調(diào)
最關(guān)鍵的一點:
如果多個元素執(zhí)行動畫,回調(diào)將在每個匹配的元素上執(zhí)行一次,不是作為整個動畫執(zhí)行一次
查看全部 -
語法:.animate(properties,[duration],[easing],[complete])
.animate(properties,option)
properties:一個或多個css屬性的鍵值對所構(gòu)成的Object對象。要特別注意所有用于動畫的屬性必須是數(shù)字的,除非另有說明
查看全部 -
jQuery是一個合集對象,如果需要單獨操作合集中的的某一個元素,可以通過.get()方法獲取到
以下有3個a元素結(jié)構(gòu):
<a>1</a> <a>2</a> <a>3</a>
通過jQuery獲取所有的a元素合集$("a"),如果想進一步在合集中找到第二2個dom元素單獨處理,可以通過get方法
語法:
.get(?[index?]?)
注意2點
get方法是獲取的dom對象,也就是通過document.getElementById獲取的對象
get方法是從0開始索引
所以第二個a元素的查找: $(a).get(1)
get方法還可以從后往前索引,傳遞一個負索引值,注意的負值的索引起始值是-1
同樣是找到第二元素,可以傳遞?$(a).get(-2)?
查看全部 -
元素的顯示隱藏:
改變樣式display為none
設(shè)置高度為0
設(shè)置透明度為0
toggle、slideToggle以及fadeToggle的區(qū)別
toggle:切換顯示與隱藏效果
slideToggle:切換上下拉卷滾效果
fadeToggle:切換淡入淡出效果
toggle與slideToggle:
toggle:動態(tài)效果為從右至左。橫向動作,toggle通過display來判斷切換所有匹配元素的可見性
slideToggle:動態(tài)效果從下至上。豎向動作,slideToggle通過高度變化來切換所有匹配元素的可見性
fadeToggle方法
fadeToggle()方法在fadeIn()和fadeOut()方法之間切換
元素是淡出顯示的,fadeToggle()會使用淡入效果顯示它們
元素是淡入顯示的,fadeToggle()會使用淡出效果顯示它們
注釋:隱藏的元素不會被完全顯示(不再影響頁面的布局)
查看全部 -
jQuery.trim()函數(shù)用于去除字符串兩端的空白字符
需要注意:
移除字符串開始和結(jié)尾處的所有換行符,空格(包括連續(xù)的空格)和制表符(tab)
如果這些空白字符在字符串中間時,它們將被保留,不會被移除
查看全部 -
fadeIn:淡入效果,內(nèi)容顯示,opacity是0到1
fadeOut:淡出效果,內(nèi)容隱藏,opacity是1到0
語法:.fadeTo(duration,opacity,callback)
必需的duration參數(shù)規(guī)定效果的時長,它可以取以下值:"slow"、"fast"或毫秒。fadeTo()方法中必需的opacity參數(shù)將淡入淡出效果設(shè)置為給定的不透明度(值介于0到1之間)??蛇x的callback參數(shù)是該函數(shù)完成后執(zhí)行的函數(shù)名稱。
查看全部
舉報