jQuery幻燈片元素向上/切換

簡單的jQuery代碼片段以使用jquery.slidetoggle（）向上滑動頁面元素或切換。不同之處在於，Jquey的slideup（）函數主要用於將元素刪除，然後使用slideWown（）使其重新啟用，而jQuery的toggleup（）函數則在同一函數中均可在同一函數中呼叫鍵入元素。

> slideup示例

<span>$('#clickme').click(function() {
</span>  <span>$('#book').slideUp('slow', function() {
</span>    <span>// Animation complete.
</span>  <span>});
</span><span>});</span>

http://api.jquery.com/slideup/

> slidetoggle示例

<span>$('#clickme').click(function() {
</span>  <span>$('#book').slideToggle('slow', function() {
</span>    <span>// Animation complete.
</span>  <span>});
</span><span>});</span>

http://api.jquery.com/slidetoggle/

http://www.learningjquery.com/2009/02/slide-elements-in-different-directions

經常詢問有關jQuery幻燈片元素的問題（常見問題解答）

>什麼是jQuery slideToggle（）方法？

> jQuery slidetoggle（）方法是jQuery中的一個內置函數，可讓您對元素創建滑動效果。它可以在slideup（）和slideWown（）方法之間切換，這意味著如果當前可見，它將向上滑動，如果隱藏了它們，它們將滑動它們。此方法對於創建可以根據用戶交互顯示或隱藏元素的交互式和動態的網頁特別有用。

>

我如何在jquery？

>

中使用slidetoggle（）方法使用slidetoggle（）方法，您需要選擇html元素，您需要選擇效果效果，然後調用sliDogggle方法，然後使用（然後）。這是一個基本示例：

$（“＃myElement”）。 slidetoggle（）;
在此示例中，如果當前可見，則具有id“ myelement”的元素將滑倒，並且如果當前隱藏了，則滑下。 slidetoggle（）效果通過將參數傳遞到slidetoggle（）方法。此參數可以是字符串（“慢”，“快速”），也可以是代表毫秒持續時間的數字。例如：

$（“＃myElement”）。 slidetoggle（“ slow”）;

在此示例中，slidetoggle（）效果將緩慢地應用於iD的元素。在slideup（）和slideWown（）方法之間切換。如果當前可見所選元素，則Slidetoggle（）將其滑動，從而將其隱藏。如果元素當前隱藏，則Slidetoggle（）將其向下滑動，使其可見。另一方面，slideup（）方法始終用滑動運動隱藏所選元素，而slideWown（）方法總是以滑動運動為選定的元素。

>我可以在slidetoggle（）效果完成後運行代碼嗎？滑動效果完成後，將執行此功能。以下是一個示例：

$（“＃myElement”）。 slidetoggle（“ slow”，function（）{
>警報（““ slide toggle complete！”完整！
是的，您可以使用stop（）方法在完成之前停止slidetoggle（）效果。此方法停止所選元素上的當前運行動畫。以下是一個示例：

$（“＃myElement”）。stop（）。slidetoggle（“ slow”）;
在此示例中，任何當前在元素上使用ID“ myElement”的動畫將停止，然後將應用slidetoggle（）效果。

是的，您可以通過使用公共類或屬性選擇一個元素上的slidetoggle（）方法。以下是一個示例：

$（“。myclass”）。slidetoggle（“ slow”）;

在此示例中，Slidetoggle（）效果將應用於所有元素的“ myClass”。使用其他jQuery方法來創造更複雜的效果。例如，您可以使用fadein（）和fadeout（）方法在滑動時淡入和淡出。以下是一個示例：

$（“＃myElement”）。slidetoggle（“ slow”）。fadein（“ slow”）。淡淡的（“ slow”）;
在此示例中，具有id“ myElement”的元素，“ myElement”的元素將在中或下降，然後逐漸消失，然後逐漸消失。元素？

slidetoggle（）方法可與所有可以具有高度的HTML元素（例如Divs，段落和標題）一起使用。 However, it may not work as expected with inline elements, such as spans or links, because these elements do not have a height by default.

Can I use the slideToggle() method if I don’t use jQuery?

The slideToggle() method is a part of jQuery, so you need to include jQuery in your project to use it.但是，您可以使用純JavaScript或CSS創建類似的效果，儘管它可能需要更多的代碼，並且可能不像使用jQuery那樣簡單。

以上是jQuery幻燈片元素向上/切換的詳細內容。更多資訊請關注PHP中文網其他相關文章！