首页 > 代码库 > jQuery动画
jQuery动画
jQuery任何动画都能指定3种速度参数"slow","normal","fast"(时间分别是0.6s 0.4s 0.2s),使用该3参数时必须加引号。另外还可以使用数字作为时间参数,例如show(1000)。
1、show()和hide()方法
show()方法 最后将元素的display属性设置为block。
hide()方法 最后将元素的display属性设置为none。
如果不给参数,就是直接将元素隐藏或显示,不会有任何动画。
如果给这2个方法设置参数 会出现一个宽度、高度和透明度分别同时改变的动画效果。
2、fadeIn()和fadeOut()方法 只改变透明度的动画效果
fadeIn()方法 元素的opacity从0到1直到显示的动画过程。
fadeOut()方法 元素的opacity从1到0直到完全消失的动画过程。
3、slideUp()和slideDown()方法 通过改变高度实现动画效果
slideDown() 从上到下过渡显示
slideUp() 从下到上过渡隐藏
4、animate() 自定义动画
animate(params, speed, callback); 可以用animate()方法来操作几乎所有的css属性。但是属性名要使用驼峰写法比如fontSize而不是连字符"-",另外色彩动画不包含在jquery核心库中
params一个包含样式属性和值的映射 {"property1":"value1", "property2:"value2", "propertyN":"valueN"}。
speed 效果的时长。
callback 动画完成之后的回调函数。
当同时编写多个animate()调用,jQuery会创建包含这些调用的队列,然后逐一运行这些调用。
jQuery动画