可以使用slideUp()
和slideDown()
方法在页面中滑动元素,前者用于向上滑动元素,后者用于向下滑动元素,它们的调用方法分别为:
$(selector).slideUp(speed,[callback])
和$(selector).slideDown(speed,[callback])
其中speed参数为滑动时的速度,单位是毫秒,可选项参数callback为滑动成功后执行的回调函数名。
要注意的是:slideDown()
仅适用于被隐藏的元素;slideup()
则相反。
例如,调用slideUp()
和slideDown()
方法实现页面中元素的向上和向下的滑动效果,如下图所示:
在浏览器中显示的效果:
从图中可以看出,根据按钮中显示的内容,分别调用slideUp()
和slideDown()
方法,实现图片元素向上和向下的滑动效果,当每个滑动效果完成时,再通过回调函数改变按钮中显示内容。
滑动与淡入淡出的区别:滑动改变元素的高度,淡入淡出改变元素的透明度。