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中文网其他相关文章！