jQuery效果

1.顯示和隱藏

$('selector').hide(speed,calback)隱藏元素

speed(可選參數(shù))可取slow或fast或毫秒值

calback(可選參數(shù))動畫完成之后執(zhí)行的函數(shù)

.$('selector').show(speed,calback)顯示元素

.$('selector').toggle(speed,calback)自動根據(jù)元素的狀態(tài)來隱藏或顯示

2.淡入淡出

.$('selector').fadeIn(speed,calback)淡入效果

.$('selector').fadeOut(speed,calback)淡出效果

.$('selector').fadeToggle(speed,calback)自動根據(jù)元素的狀態(tài)來淡入或淡出

$(selector).fadeTo(speed,opacity,callback);

speed(必選參數(shù))opacity(必選參數(shù))

fadeTo() 方法中必需的 opacity 參數(shù)將淡入淡出效果設置為給定的不透明度(值介于 0 與 1 之間)

3.上下滑動

.$('selector').slideUp(speed,calback)上滑

.$('selector').slideDown(speed,calback)下滑

.$('selector').slideToggle(speed,calback)自動根據(jù)元素的狀態(tài)來上滑或下滑

4.動畫

定義動畫

$(selector).animate({params},speed,callback)

params(必選參數(shù))定義形成動畫的css屬性,可使用多個css屬性,屬性要用駝峰命名法,例如上邊距使用

marginTop而不是margin-top,還可以把動畫設成預定的值,例如(show,hide,toggle...),可定義多個動畫,它們會按順序執(zhí)行

停止動畫

$(selector).stop(stopAll,goToEnd)

stopAll(可選參數(shù))默認值為false,僅停止當前的動畫,允許后面的動畫執(zhí)行;為true的話停止所有的動畫

goToEnd(可選參數(shù))默認值為false? 規(guī)定是否立即完成當前動畫

5.可以把動作/方法鏈在一起

例如:$('p').css('color','blue').css('fontSize','20px').hide()

p標簽會先變成藍色,然后字體大小變成20px,再隱藏

也可以這樣寫

$('p').css('color','blue')

.css('fontSize','20px')

.hide()

jQuery 會拋掉多余的空格,并當成一行長代碼來執(zhí)行上面的代碼行

?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

  • jQuery hide() 和 show() 通過 jQuery,您可以使用 hide() 和 show() 方法...
    convertible閱讀 237評論 0 1
  • 目錄 jQuery 隱藏/顯示jQuery 淡入淡出jQuery 滑動jQuery 動畫jQuery Callba...
    噫那里有條咸魚閱讀 420評論 0 1
  • 隱藏和顯示 在 jQuery 中可以使用 hide() 和 show() 方法來隱藏和顯示 HTML 元素,以及使...
    極客_Ls閱讀 276評論 0 0
  • 隱藏/顯示jQuery hide()和show(): jQuery toggle(): 淡入淡出fadeIn()、...
    筱南獨舞閱讀 371評論 0 1
  • 1.通過 jQuery,可以使用 hide() 和 show() 方法來隱藏和顯示 HTML 元素: 2.可選的 ...
    ancientear閱讀 651評論 0 3

友情鏈接更多精彩內(nèi)容