# 滑动效果

URL: https://caijiao.org/jquery/05-effects/03-slide
Source: docs/jquery/05-effects/03-slide.md
Description: 本文介绍 jQuery 提供的滑动效果方法，包括 slideDown、slideUp 和 slideToggle，用于实现元素上下展开与收起的动画效果，增强用户交互体验。

jQuery 的滑动动画可以实现元素在垂直方向上的平滑展开与收起，常用于手风琴菜单、折叠面板等交互场景。

## 常用滑动方法

### `slideDown([speed, callback])`

元素由上向下展开显示。

```js
$("#panel").slideDown();
```

### `slideUp([speed, callback])`

元素向上收起隐藏。

```js
$("#panel").slideUp();
```

### `slideToggle([speed, callback])`

在展开和收起之间切换。

```js
$("#panel").slideToggle(600);
```

## 应用场景

- FAQ 折叠问答
- 手风琴导航菜单
- 下拉面板或隐藏内容的展开与收起

## 示例代码

[在线代码演示](/jquery/demos/16.html)