jQuery滑动

简介: jQuery滑动

向下滑动:slideDown([speed],[easing],[fn])


通过高度变化(向下增大)来动态地显示所有匹配的元素,在显示完成后可选地触发一个回调函数。


speed[,fn]:

speed:三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如:1000)


fn:在动画完成时执行的函数,每个元素执行一次。


[speed],[easing],[fn]:

speed:三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如:1000)


easing:(Optional) 用来指定切换效果,默认是"swing",可用参数"linear"

fn在动画完成时执行的函数,每个元素执行一次。

//以滑动方式显示隐藏的 <p> 元素:
$(".btn2").click(function(){
  $("p").slideDown();
});

向上减小:slideUp([speed,[easing],[fn]]):


通过高度变化(向上减小)来动态地隐藏所有匹配的元素,在隐藏完成后可选地触发一个回调函数。


speed[,fn]:

speed:三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如:1000)


fn:在动画完成时执行的函数,每个元素执行一次。


[speed],[easing],[fn]:

speed:三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如:1000)


easing:(Optional) 用来指定切换效果,默认是"swing",可用参数"linear"

fn:在动画完成时执行的函数,每个元素执行一次。

//用600毫秒缓慢的将段落滑上
$("p").slideUp(600)

高度来回切换:slideToggle([speed],[easing],[fn]):


通过高度变化来切换所有匹配元素的可见性,并在切换完成后可选地触发一个回调函数。


speed[,fn]:

speed:三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如:1000)


fn:在动画完成时执行的函数,每个元素执行一次。


[speed],[easing],[fn]:

speed:三种预定速度之一的字符串("slow","normal", or "fast")或表示动画时长的毫秒数值(如:1000)


easing:(Optional) 用来指定切换效果,默认是"swing",可用参数"linear"

fn:在动画完成时执行的函数,每个元素执行一次。

//用600毫秒缓慢的将段落滑上或滑下
$("p").slideToggle(600);

希望这个jQuery的滑动效果对大家有帮助,也谢谢大家来观看我的博客哦~

相关文章
|
19天前
|
JavaScript
jQuery 效果 - 滑动
jQuery 效果 - 滑动
16 5
|
2月前
|
JavaScript
|
2月前
|
JavaScript
jQuery制作滑动特效(1)
jQuery制作滑动特效(1)
|
2月前
|
JavaScript 前端开发
jQuery 第五章(效果,滑动,动画,停止动画)
jQuery 第五章(效果,滑动,动画,停止动画)
63 0
|
10月前
|
JavaScript
jquery返回顶部--滑动底部显示出
jquery返回顶部--滑动底部显示出
|
JavaScript
jQuery 效果 - 滑动
jQuery 效果 - 滑动
61 0
|
JavaScript 前端开发 程序员
【前端】使用jQuery封装一套UI组件 - 是和否滑动切换组件
本篇文章来讲解下是和否的滑动切换组件 切换滑动组件,使用的场景实际上就是一个开和关的场景,一般有是和否,开和关,禁用和启用等等,只需要设置0和1即可
131 0
|
JavaScript
jquery:简洁版滑动下拉菜单-21
jquery:简洁版滑动下拉菜单-21
87 0
jquery:简洁版滑动下拉菜单-21
|
JavaScript
jquery简洁版滑动下拉菜单问题解决-22
jquery简洁版滑动下拉菜单问题解决-22
86 0
jquery简洁版滑动下拉菜单问题解决-22
|
JavaScript 前端开发
jQuery案例:图文滑动手风琴特效
jQuery案例:图文滑动手风琴特效
126 0
jQuery案例:图文滑动手风琴特效