jquery怎樣讓一個div漸變消失

2019-12-12 16:43:33

jquery讓一個div漸變消失，需要用到fadeOut（）方法，下面以按鈕點選觸發div漸變消失為例，講解實現這個效果的過程。

新建一個html檔案，命名為test.html，用於實現使用jquery方法讓一個div漸變消失。

在test.html，使用script標籤載入jquery.min.js庫檔案，只有成功載入該檔案才能使用fadeOut()方法。

在test.html頁面，建立一個div模組和一個button按鈕，分別設定它們的class屬性名，用於下面步驟對它們進行操作。

使用css對div進行樣式布局，設定其高寬都為300px，並設定其背景顏色為紅色，程式碼如下：

給按鈕系結click點選事件，在按鈕被點選時，執行function函數，程式碼如下：

在function函數內，獲得div物件，並使用fadeOut()方法讓div緩慢（slow）地消失。

在瀏覽器開啟test.html檔案，檢視實現的效果，可見當點選「逐漸消失」按鈕後，div漸變消失。