第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

jQuery中淡入效果fadeTo

淡入淡出fadeIn與fadeOut都是修改元素樣式的opacity屬性，但是他們都有個(gè)共同的特點(diǎn)，變化的區(qū)間要么是0，要么是1

fadeIn：淡入效果，內(nèi)容顯示，opacity是0到1 fadeOut：淡出效果，內(nèi)容隱藏，opacity是1到0

如果要讓元素保持動(dòng)畫效果，執(zhí)行opacity = 0.5的效果時(shí)，要如何處理？

如果不考慮CSS3，我們用JS實(shí)現(xiàn)的話，基本就是通過定時(shí)器，在設(shè)定的時(shí)間內(nèi)一點(diǎn)點(diǎn)的修改opacity的值，最終為0.5，原理雖說簡單，但是總不如一鍵設(shè)置這么舒服，jQuery提供了fadeTo方法，可以讓改變透明度一步到位

語法

.fadeTo( duration, opacity ,callback)

必需的 duration參數(shù)規(guī)定效果的時(shí)長。它可以取以下值："slow"、"fast" 或毫秒。fadeTo() 方法中必需的 opacity 參數(shù)將淡入淡出效果設(shè)置為給定的不透明度（值介于 0 與 1 之間）。可選的 callback 參數(shù)是該函數(shù)完成后所執(zhí)行的函數(shù)名稱。

fadeToggle切換fadeOut與fadeIn效果，所謂"切換"，即如果元素當(dāng)前是可見的，則將其隱藏(淡出)；如果元素當(dāng)前是隱藏的，則使其顯示(淡入)。

fadeIn()函數(shù)用于顯示所有匹配的元素，并帶有淡入的過渡動(dòng)畫效果。

注意：

• 淡入的動(dòng)畫原理：操作元素的不透明度從0%逐漸增加到100%

• 如果元素本身是可見的，不對其作任何改變。如果元素是隱藏的，則使其可見

jQuery中淡出動(dòng)畫fadeOut

讓元素在頁面不可見，常用的辦法就是通過設(shè)置樣式的display:none。除此之外還可以一些類似的辦法可以達(dá)到這個(gè)目的。這里要提一個(gè)透明度的方法，設(shè)置元素透明度為0，可以讓元素不可見，透明度的參數(shù)是0~1之間的值，通過改變這個(gè)值可以讓元素有一個(gè)透明度的效果。常見的淡入淡出動(dòng)畫正是這樣的原理。

fadeOut()函數(shù)用于隱藏所有匹配的元素，并帶有淡出的過渡動(dòng)畫效果

所謂"淡出"隱藏的，元素是隱藏狀態(tài)不對作任何改變，元素是可見的，則將其隱藏。

.fadeOut(?[duration?],?[?complete?]?)

通過不透明度的變化來實(shí)現(xiàn)所有匹配元素的淡出效果，并在動(dòng)畫完成后可選地觸發(fā)一個(gè)回調(diào)函數(shù)。這個(gè)動(dòng)畫只調(diào)整元素的不透明度，也就是說所有匹配的元素的高度和寬度不會(huì)發(fā)生變化。

字符串 'fast' 和 'slow' 分別代表200和600毫秒的延時(shí)。如果提供任何其他字符串，或者這個(gè)duration參數(shù)被省略，那么默認(rèn)使用400毫秒的延時(shí)

jQuery中上卷下拉切換slideToggle

slideDown與slideUp是一對相反的方法。需要對元素進(jìn)行上下拉卷效果的切換，jQuery提供了一個(gè)便捷方法slideToggle用滑動(dòng)動(dòng)畫顯示或隱藏一個(gè)匹配元素

基本的操作：slideToggle();

這是最基本的操作，獲取元素的高度，使這個(gè)元素的高度發(fā)生改變，從而讓元素里的內(nèi)容往下或往上滑。

提供參數(shù)：.slideToggle( [duration ] ,[?complete ] )

同樣的提供了時(shí)間、還有動(dòng)畫結(jié)束的回調(diào)。在參數(shù)對應(yīng)的時(shí)間內(nèi)，元素會(huì)完成動(dòng)畫，然后出發(fā)回調(diào)函數(shù)

同時(shí)也提供了時(shí)間的快速定義，字符串 'fast' 和 'slow' 分別代表200和600毫秒的延時(shí)

slideToggle("fast")??slideToggle("slow")

注意：

• display屬性值保存在jQuery的數(shù)據(jù)緩存中，所以display可以方便以后可以恢復(fù)到其初始值

• 當(dāng)一個(gè)隱藏動(dòng)畫后，高度值達(dá)到0的時(shí)候，display 樣式屬性被設(shè)置為none，以確保該元素不再影響頁面布局

最簡單的使用：不帶參數(shù)

$("elem").slideUp();

這個(gè)使用的含義就是：找到元素的高度，然后采用一個(gè)下滑動(dòng)畫讓元素一直滑到隱藏!!!，當(dāng)高度為0的時(shí)候，也就是不可見的時(shí)，修改元素display 樣式屬性被設(shè)置為none。這樣就能確保這個(gè)元素不會(huì)影響頁面布局了

帶參數(shù)：

.slideUp(?[duration?]?[,?easing?]?[,?complete?]?)

同樣可以提供一個(gè)時(shí)間，然后可以使用一種過渡使用哪種緩動(dòng)函數(shù)，jQuery默認(rèn)就2種，可以通過下載插件支持。最后一個(gè)動(dòng)畫結(jié)束的回調(diào)方法。

因?yàn)閯?dòng)畫是異步的，所以要在動(dòng)畫之后執(zhí)行某些操作就必須要寫到回調(diào)函數(shù)里面，這里要特別注意

.slideDown()：用滑動(dòng)動(dòng)畫顯示一個(gè)匹配元素

.slideDown()方法將給匹配元素的高度的動(dòng)畫，這會(huì)導(dǎo)致頁面的下面部分滑下去，彌補(bǔ)了顯示的方式

常見的操作，提供一個(gè)動(dòng)畫是時(shí)間，然后傳遞一個(gè)回調(diào)，用于知道動(dòng)畫是什么時(shí)候結(jié)束

.slideDown(?[duration?]?[,?complete?]?)

持續(xù)時(shí)間（duration）是以毫秒為單位的，數(shù)值越大，動(dòng)畫越慢，不是越快。字符串 'fast' 和 'slow' 分別代表200和600毫秒的延時(shí)。如果提供任何其他字符串，或者這個(gè)duration參數(shù)被省略，那么默認(rèn)使用400 毫秒的延時(shí)。

具體使用：

$("ele").slideDown(1000,?{
????//等待動(dòng)畫執(zhí)行1秒后,執(zhí)行別的動(dòng)作....
});

注意事項(xiàng)：

• 下拉動(dòng)畫是從無到有，所以一開始元素是需要先隱藏起來的，可以設(shè)置display:none

• 如 果提供回調(diào)函數(shù)參數(shù)，callback會(huì)在動(dòng)畫完成的時(shí)候調(diào)用。將不同的動(dòng)畫串聯(lián)在一起按順序排列執(zhí)行是非常有用的。這個(gè)回調(diào)函數(shù)不設(shè)置任何參數(shù)，但是 this會(huì)設(shè)成將要執(zhí)行動(dòng)畫的那個(gè)DOM元素，如果多個(gè)元素一起做動(dòng)畫效果，那么要非常注意，回調(diào)函數(shù)會(huì)在每一個(gè)元素執(zhí)行完動(dòng)畫后都執(zhí)行一次，而不是這組 動(dòng)畫整體才執(zhí)行一次

jQuery中顯示與隱藏切換toggle方法

show與hide是一對互斥的方法。需要對元素進(jìn)行顯示隱藏的互斥切換，通常情況是需要先判斷元素的display狀態(tài)，然后調(diào)用其對應(yīng)的處理方法。比如顯示的元素，那么就要調(diào)用hide，反之亦然。 對于這樣的操作行為，jQuery提供了一個(gè)便捷方法toggle用于切換顯示或隱藏匹配元素

基本的操作：toggle();

這是最基本的操作，處理元素顯示或者隱藏，因?yàn)椴粠?shù)，所以沒有動(dòng)畫。通過改變CSS的display屬性，匹配的元素將被立即顯示或隱藏，沒有動(dòng)畫。

• 如果元素是最初顯示，它會(huì)被隱藏

• 如果隱藏的，它會(huì)顯示出來

display屬性將被儲(chǔ)存并且需要的時(shí)候可以恢復(fù)。如果一個(gè)元素的display值為inline，然后是隱藏和顯示，這個(gè)元素將再次顯示inline

提供參數(shù)：.toggle( [duration ] [, complete ] )

同樣的提供了時(shí)間、還有動(dòng)畫結(jié)束的回調(diào)。在參數(shù)對應(yīng)的時(shí)間內(nèi)，元素會(huì)發(fā)生顯示/隱藏的改變，在改變的過程中會(huì)把元素的高、寬、不透明度進(jìn)行一系列動(dòng)畫效果。這個(gè)元素其實(shí)就是show與hide的方法

直接定位：.toggle(displ)ay

直接提供一個(gè)參數(shù)，指定要改變的元素的最終效果

其實(shí)就是確定是使用show還是hide方法

if?(?display?===?true?)?{???$(?"elem"?).show();?}?else?if?(?display?===?false?)?{???$(?"elem"?).hide();?}

jQuery中顯示元素的show方法

css中有display:none屬性，同時(shí)也有display:block，所以jQuery同樣提供了與hide相反的show方法

方法的使用幾乎與hide是一致的，hide是讓元素顯示到隱藏，show則是相反，讓元素從隱藏到顯示

看一段代碼：使用上一致，結(jié)果相反

$('elem').hide(3000).show(3000)

讓元素執(zhí)行3秒的隱藏動(dòng)畫，然后執(zhí)行3秒的顯示動(dòng)畫。

show與hide方法是非常常用的，但是一般很少會(huì)基于這2個(gè)屬性執(zhí)行動(dòng)畫，大多情況下還是直接操作元素的顯示與隱藏為主

注意事項(xiàng)：

• show與hide方法是修改的display屬性，通過是visibility屬性布局需要通過css方法單獨(dú)設(shè)置

• 如果使用!important在你的樣式中，比如display: none !important，如果你希望.show()方法正常工作，必須使用.css('display', 'block !important')重寫樣式

• 如果讓show與hide成為一個(gè)動(dòng)畫，那么默認(rèn)執(zhí)行動(dòng)畫會(huì)改變元素的高度，高度，透明度

jQuery中隱藏元素的hide方法

讓頁面上的元素不可見，一般可以通過設(shè)置css的display為none屬性。但是通過css直接修改是靜態(tài)的布局，如果在代碼執(zhí)行的時(shí)候，一般是通過js控制元素的style屬性，這里jQuery提供了一個(gè)快捷的方法.hide()來達(dá)到這個(gè)效果

$elem.hide()

提供參數(shù)：

.hide(?options?)

當(dāng)提供hide方法一個(gè)參數(shù)時(shí)，.hide()就會(huì)成為一個(gè)動(dòng)畫方法。.hide()方法將會(huì)匹配元素的寬度，高度，以及不透明度，同時(shí)進(jìn)行動(dòng)畫操作

快捷參數(shù)：

.hide("fast?/?slow")

這是一個(gè)動(dòng)畫設(shè)置的快捷方式，'fast' 和 'slow' 分別代表200和600毫秒的延時(shí)，就是元素會(huì)執(zhí)行200/600毫秒的動(dòng)畫后再隱藏

$("button:last").click(function() {

? ? ? ? ? ? $("#a2").hide({

? ? ? ? ? ? ? ? duration: 3000,

//duration不是速度，是事件所用的時(shí)間，默認(rèn)是0

? ? ? ? ? ? ? ? complete: function() {

? ? ? ? ? ? ? ? ? ? alert('執(zhí)行3000ms動(dòng)畫完畢')

? ? ? ? ? ? ? ? }

? ? ? ? ? ? })

<script src="http://idcbgp.cn/static/lib/jquery/1.9.1/jquery.js"></script>

fadeto 可淡入淡出至想要的透明度

fadeout 淡出 fadein 淡入

????????移除字符串開始和結(jié)尾處的所有換行符，空格(包括連續(xù)的空格)和制表符（tab）

• 如果這些空白字符在字符串中間時(shí)，它們將被保留，不會(huì)被移除

jq中Dom元素的獲取index方法

.index()方法，從匹配的元素中搜索給定元素的索引值，從0開始計(jì)數(shù)。

.index()

.index(selector)

.index(element)

• 如果不傳遞任何參數(shù)給 .index() 方法，則返回值就是jQuery對象中第一個(gè)元素相對于它同輩元素的位置

• 如果在一組元素上調(diào)用 .index() ，并且參數(shù)是一個(gè)DOM元素或jQuery對象， .index() 返回值就是傳入的元素相對于原先集合的位置

• 如果參數(shù)是一個(gè)選擇器， .index() 返回值就是原先元素相對于選擇器匹配元素的位置。如果找不到匹配的元素，則 .index() 返回 -1

例子

<ul>

????<a></a>

????<li id="text1">1</li>

????<li id="text1">2</li>

????<li id="text1">3</li>

</ul>

$("li").index() 沒有傳遞參數(shù)，反正的結(jié)果是1，它的意思是返回同輩的排列循序，第一個(gè)li之前有a元素,同輩元素是a開始為0，所以li的開始索引是1

如果要快速找到第二個(gè)li在列表中的索引,可以通過如下2種方式處理

$("li").index(document.getElementById("test2")//通過傳遞dom對象查找

$("li").index($("test2"));//通過傳遞jquery對象查找