slidetoggle()方法的定義和用法

本篇內容主要講解“slidetoggle()方法的定義和用法”，感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷，實用性強。下面就讓小編來帶大家學習“slidetoggle()方法的定義和用法”吧!

　　.slideToggle()方法將給匹配元素的高度的動畫，這會導致頁面中，在這個元素下面的內容往下或往上滑。display屬性值保存在jQuery的數據緩存中，所以display可以方便以后可以恢復到其初始值。如果一個元素的display屬性值為inline，然后是隱藏和顯示，這個元素將再次顯示inline。當一個隱藏動畫后，高度值達到0的時候，display樣式屬性被設置為none，以確保該元素不再影響頁面布局。持續時間是以毫秒為單位的，數值越大，動畫越慢，不是越快。字符串'fast'和'slow'分別代表200和600毫秒的延時

　　.slideToggle()定義和用法

　　slideToggle()方法通過使用滑動效果（高度變化）來切換元素的可見狀態。

　　如果被選元素是可見的，則隱藏這些元素，如果被選元素是隱藏的，則顯示這些元素。

　　語法

　　$(selector).slideToggle(speed,callback)

　　參數 描述

　　speed 

　　可選。規定元素從隱藏到可見的速度（或者相反）。默認為"normal"。

　　可能的值：

　　毫秒（比如1500）

　　"slow"

　　"normal"

　　"fast"

　　在設置速度的情況下，元素在切換的過程中，會逐漸地改變其高度（這樣會創造滑動效果）。

　　callback 

　　可選。toggle函數執行完之后，要執行的函數。

　　如需學習更多有關callback的內容，請訪問我們的jQueryCallback這一章。

　　除非設置了speed參數，否則不能設置該參數。

　　.slideToggle()使用

　　我們可以給任何元素做動畫，比如一個簡單的圖片：

　　<divid="clickme">

　　Clickhere

　　</div>

　　<imgid="book"src="book.png"alt=""width="100"height="123"/>

　　當另一個元素被點擊時，.slideToggle()將被調用：

　　$('#clickme').click(function(){

　　$('#book').slideToggle('slow',function(){

　　//Animationcomplete.

　　});

　　});

　　隨著最初顯示的元素，我們可以在第一次點擊的時候將其緩慢隱藏。

到此，相信大家對“slidetoggle()方法的定義和用法”有了更深的了解，不妨來實際操作一番吧！這里是億速云網站，更多相關內容可以進入相關頻道進行查詢，關注我們，繼續學習！