1. 滑入动画(类似于商店的卷帘门)
$(selector).slideDown(speed, 回调函数);
解释: 此语句实现的功能为, 在XX时间内, 下拉动画, 显现元素。
当 slideDown() 中省略参数, 或者传入不合法的值是, 那么系统会使用默认值:400ms。
回调函数可以省略不写。
示例代码如下:
jQuery之滑入动画
2. 滑出动画效果
$(selector).slideUp(speed, 回调函数);
解释: 此语句实现的功能为, 在XX时间内, 上拉动画, 显现元素。
当 slideUp() 中省略参数, 或者传入不合法的值是, 那么系统会使用默认值:400ms。
回调函数可以省略不写。
示例代码如下:
jQuery之滑出动画
3. 便捷滑入滑出动画效果
$(selector).slideToggle(speed, 回调函数);
使用此方法, 可以进行滑入滑出效果的切换, 此方法有两种情形:
(1)当元素的设置为:display = block; 也就是元素已经显示时, 使用 slideToggle()将会变成上拉隐藏。
(2)当元素的设置为:display = none; 也就是元素已经隐藏时, 使用 slideToggle()将会变成下拉显示。
回调函数可以省略不写。
示例代码如下:(元素属性 display = block;)
jQuery之滑入滑出动画
4. jQuery滑入滑出动画实例:
按钮控制元素滑入滑出