jQuery Slide 滑动

通过jQuery库可使HTML元素滑动显示或消失，相关方法如下：

• slideDown() 下滑显示（运行一下）
• slideUp() 上滑消失（运行一下）
• slideToggle() 以上下滑动的方式切换隐藏与显示状态（运行一下）

---

slideDown() 方法

通过jQuery库中的slideDown()方法可以使隐藏状态的元素以向下滑动的方式显现。

slideDown()语法：

$(selector).slideDown(speed, callback);

其中speed和callback都是非必选参数。speed参数指下滑显示的速度，可以取值“slow”、“fast”、具体的毫秒数。callback参数指代回调函数，即当slideDown方法执行成功后再进行回调运行的函数。举例如下：

$("button").click(function(){
    $("#panel").slideDown();
});

运行一下

---

slideUp() 方法

通过jQuery库中的slideUp()方法可以使指定可视元素以向上滑动的方式消失。

slideUp()语法：

$(selector).slideUp(speed, callback);

其中speed和callback都是非必选参数。speed参数指上滑消失的速度，可以取值“slow”、“fast”、具体的毫秒数。callback参数指代回调函数，即当slideUp方法执行成功后再进行回调运行的函数。举例如下：

$("button").click(function(){
    $("#panel").slideUp();
});

运行一下

---

slideToggle() 方法

通过jQuery库中的slideToggle()方法可以上下滑动的方式切换隐藏与显示状态失。

slideToggle()语法：

$(selector).slideToggle(speed, callback);

其中speed和callback都是非必选参数。speed参数指上下滑动的速度，可以取值“slow”、“fast”、具体的毫秒数。callback参数指代回调函数，即当slideToggle方法执行成功后再进行回调运行的函数。举例如下：

$("button").click(function(){
    $("#panel").slideToggle();
});

运行一下