jQuery 滑动

jQuery效果 - 滑动

jQuery幻灯片方法上下滑动元素。

单击以向下/向上滑动面板

因为时间很宝贵，所以我们提供快速简便的学习。在蝴蝶教程，您可以以易于使用的方式学习您需要学习的所有内容。

使用jQuery，您可以在元素上创建滑动效果。

jQuery有以下滑动方法：
- slideDown()
- slideUp()
- slideToggle()
jQuery slideDown()方法

jQuery slideDown()方法用于向下滑动元素。

语法：$(selector).slideDown(speed,callback);

可选的speed参数指定效果的持续时间。它可以采用以下值："slow", "fast"或者毫秒。

可选的回调参数是在滑动完成后要执行的函数。

以下示例演示了slideDown()方法：
```
   
           <head>
              <script type="text/javascript" src="jquery.js"></script>
              <script type="text/javascript">
              $("#flip").click(function(){
                $("#panel").slideDown();
              });
             </script>
           </head>
```
尝试一下
jQuery slideUp()方法

jQuery slideUp()方法用于向上滑动元素。

语法：$(selector).slideUp(speed,callback)

可选的speed参数指定效果的持续时间。它可以采用以下值："slow", "fast"或者毫秒。

可选的回调参数是在滑动完成后要执行的函数。

以下示例演示了具有不同参数的slideUp()方法：
```
   
           <head>
              <script type="text/javascript" src="jquery.js"></script>
              <script type="text/javascript">
              $("#flip").click(function(){
                $("#panel").slideUp();
              });
             </script>
           </head>
```
尝试一下
jQuery slideToggle()方法

jQuery slideToggle()方法在slideDown和slideUp方法之间切换。

如果元素已经滑落，slideToggle()将向上滑动它们。

如果元素已经滑动，slideToggle()将向下滑动它们。

语法：$(selector).slideToggle(speed,callback);

可选的speed参数指定效果的持续时间。它可以采用以下值："slow", "fast"或者毫秒。

可选的回调参数是在滑动切换完成后要执行的函数。

以下示例演示了slideToggle()方法：
```
   
           <head>
              <script type="text/javascript" src="jquery.js"></script>
              <script type="text/javascript">
              $("#flip").click(function(){
                $("#panel").slideToggle();
              });
             </script>
           </head>
```
尝试一下
有关所有jQuery效果的完整概述，请转到我们的jQuery效果参考手册。

jQuery 滑动

jQuery效果 - 滑动

jQuery slideDown()方法

jQuery slideUp()方法

jQuery slideToggle()方法