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

$('#a1').slideToggle(3000);? ?滑動切換，單次時間為三秒。

.slideUp()：滑上（滑出）動畫

使用方式：

????1.$('div').slideUp(3000);? ?三秒滑出

????2.$('div').slideUp(3000,function(){});? ?三秒滑出，并執(zhí)行回調(diào)函數(shù)。

滑出動畫其實(shí)就是display變?yōu)閚one的過程。

.slideDown()：滑下，也叫滑入，下拉動畫的意思。

使用方式：

????1.$('div').slideDown(3000);? ?三秒的時間滑入

????2.$('div').slideDown(3000,function(){});? 三秒滑入，并執(zhí)行回調(diào)函數(shù)。

使用滑入動畫之前要確保盒子是隱藏的，也就是display屬性值為none。

.toggle()：切換的意思，在顯示與隱藏之間來回切換。

如果元素最初是顯示的，他會被隱藏；

如果元素最初是隱藏的，它會被顯示；

使用方式：

????1.直接顯示隱藏： .toggle()

????2.指定時間：.toggle(3000)

????3.指定時間和回調(diào)函數(shù)：.toggle(3000,function(){})

控制元素的顯示和隱藏，改變的是display屬性。

.show()：顯示元素

使用和.hide()完全一致。

注意事項(xiàng)：

????

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

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

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

.hide()：隱藏元素

有四種類型：

????1.$('div').hide()? ? ?直接隱藏

????2.$('div').hide(3000)? ? 三秒后隱藏

????3.$('div').hide('fast')? ? 通過設(shè)置值隱藏。fast、normal、slow

????4.$('div').hide(3000,function(){

????????????alert("........")

})? ? ?三秒后隱藏，并執(zhí)行回調(diào)函數(shù)

• .stop(); 停止當(dāng)前動畫，點(diǎn)擊在暫停處繼續(xù)開始

• .stop(true); 如果同一元素調(diào)用多個動畫方法，尚未被執(zhí)行的動畫被放置在元素的效果隊(duì)列中。這些動畫不會開始，直到第一個完成。

• .stop(); 停止當(dāng)前動畫，點(diǎn)擊在暫停處繼續(xù)開始

• .stop(true); 如果同一元素調(diào)用多個動畫方法，尚未被執(zhí)行的動畫被放置在元素的效果隊(duì)列中。這些動畫不會開始，直到第一個完成。

• .stop(); 停止當(dāng)前動畫，點(diǎn)擊在暫停處繼續(xù)開始

• .stop(true); 如果同一元素調(diào)用多個動畫方法，尚未被執(zhí)行的動畫被放置在元素的效果隊(duì)列中。這些動畫不會開始，直到第一個完成。

• .stop(); 停止當(dāng)前動畫，點(diǎn)擊在暫停處繼續(xù)開始

• .stop(true); 如果同一元素調(diào)用多個動畫方法，尚未被執(zhí)行的動畫被放置在元素的效果隊(duì)列中。這些動畫不會開始，直到第一個完成。

• .stop(true,true); 當(dāng)前動畫將停止，但該元素上的 CSS 屬性會被立刻修改成動畫的目標(biāo)值

簡單的說：參考下面代碼、

$("#aaron").animate({
????height:?300
},?5000)
$("#aaron").animate({
????width:?300
},?5000)
$("#aaron").animate({
????opacity:?0.6
},?2000)

1. stop()：只會停止第一個動畫，第二個第三個繼續(xù)

2. stop(true)：停止第一個、第二個和第三個動畫

3. stop(true ture)：停止動畫，直接跳到第一個動畫的最終狀態(tài)?

• progress：每一次動畫調(diào)用的時候會執(zhí)行這個回調(diào)，就是一個進(jìn)度的概念

如果多個元素執(zhí)行動畫，回調(diào)將在每個匹配的元素上執(zhí)行一次，不是作為整個動畫執(zhí)行一次

$('#elem').animate({
????width:?'toggle',??
????height:?'toggle'
??},?{
????duration:?5000,
????specialEasing:?{
??????width:?'linear',
??????height:?'easeOutBounce'
????},
????complete:?function()?{
??????$(this).after('<div>Animation?complete.</div>');
????}
??});

animate()方法實(shí)際應(yīng)用

.animate({
????left:?50,?
????width:?'50px'???
????opacity:?'show',??
????fontSize:?"10em",
},?500);

.animate({
????width:?"toggle"
});

.animate({?
????left:?'+=50px'
},?"slow");

操作一個元素執(zhí)行3秒的淡入動畫，對比一下2組動畫設(shè)置的區(qū)別
$(elem).fadeOut(3000)??
$(elem).animate({???
????opacity:0
},3000)

• toggle：切換顯示與隱藏效果

• sildeToggle：切換上下拉卷滾效果

• fadeToggle：切換淡入淡出效果

toggle與slideToggle細(xì)節(jié)區(qū)別：

• toggle：動態(tài)效果為從右至左。橫向動作，toggle通過display來判斷切換所有匹配元素的可見性

• slideToggle：動態(tài)效果從下至上。豎向動作，slideToggle 通過高度變化來切換所有匹配元素的可見性

fadeTo()方法淡入效果

fadeTo(3000,0.2,function(){

? ? ? 3000為時間單位毫秒 0.2位透明度? 后面可以使用函數(shù)

})

fadeToggle()方法同fadeOut()方法和fadeIn()方法同等

實(shí)現(xiàn)淡入淡出效果

可使用回調(diào)函數(shù)

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

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

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

可以使用回調(diào)函數(shù)