jQuery中fadeOut()方法用法實例
來源:易賢網(wǎng) 閱讀:1271 次 日期:2014-12-26 14:37:55
溫馨提示:易賢網(wǎng)小編為您整理了“jQuery中fadeOut()方法用法實例”,方便廣大網(wǎng)友查閱!

本文實例講述了jQuery中fadeOut()方法用法。分享給大家供大家參考。具體分析如下:

此方法通過不透明度的變化來實現(xiàn)所有匹配元素的淡出效果,并在動畫完成后可選地觸發(fā)一個回調(diào)函數(shù)。

fadeOut()方法的用法:

此方法可以規(guī)定動畫效果的持續(xù)時間。例如:

復制代碼 代碼如下:$("div").fadeOut(5000)

以上代碼規(guī)定div的淡出效果可在5000毫秒(5秒)內(nèi)完成。

此方法也可以在動畫完成后觸發(fā)一個回調(diào)函數(shù)。例如:

復制代碼 代碼如下:$("div").fadeOut(5000,function(){alert('動畫效果完成!')})

以上代碼能夠在動畫完成以后觸發(fā)回調(diào)函數(shù),于是彈出一個提示框。

實例代碼:

復制代碼 代碼如下:

<!DOCTYPE HTML>

<html>

<head>

<meta charset="utf-8"/>

<meta name="author" content=" />

<title>fadeOut()函數(shù)-腳本之家</title>

<style type="text/css">

div{

  background:#060;

  width:300px;

  height:300px;

  color:red

}

</style>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript">

$(document).ready(function(){

  $("#up").click(function(){

    $("div").fadeOut(5000,function(){alert('動畫效果完成!')});

  })

})

</script>

</head>

<body>

  <div></div>

  <button id="up">點擊查看效果</button>

</body>

</html>

以上代碼點擊按鈕可以緩慢將div設置為透明效果,完全透明之后,然后指定回調(diào)函數(shù)。

希望本文所述對大家的jQuery程序設計有所幫助。

更多信息請查看IT技術專欄

更多信息請查看腳本欄目
易賢網(wǎng)手機網(wǎng)站地址:jQuery中fadeOut()方法用法實例

2025國考·省考課程試聽報名

  • 報班類型
  • 姓名
  • 手機號
  • 驗證碼
關于我們 | 聯(lián)系我們 | 人才招聘 | 網(wǎng)站聲明 | 網(wǎng)站幫助 | 非正式的簡要咨詢 | 簡要咨詢須知 | 新媒體/短視頻平臺 | 手機站點 | 投訴建議
工業(yè)和信息化部備案號:滇ICP備2023014141號-1 云南省教育廳備案號:云教ICP備0901021 滇公網(wǎng)安備53010202001879號 人力資源服務許可證:(云)人服證字(2023)第0102001523號
聯(lián)系電話:0871-65099533/13759567129 獲取招聘考試信息及咨詢關注公眾號:hfpxwx
咨詢QQ:1093837350(9:00—18:00)版權所有:易賢網(wǎng)