jQuery学习笔记(四)

来源:互联网 发布:ted演讲软件下载 编辑:程序博客网 时间:2024/04/29 01:28

jQuery动画小结

滑动

.slideUp([sec], [fn]): 改变元素的高度,将一个可见的元素从下到上缩短隐藏,直至元素不可见为止。此时元素的display值为none.

.slideDown([sec], [fn]): 将一个display值为none的元素,改变其可见性并且从上到下延伸显示。

.slideToggle([sec], [fn]): 上述两个方法的toggle方法

淡入淡出

.fadeOut([sec], [fn]): 改变元素的透明度,将一个可见元素的的透明度变为0,直到元素不可见为止。此时元素的displaynone

.fadeIn([sec], [fn]): 将一个display值为none的元素,改变其可见性,并且将透明度变为1。

.fadeToggle([sec], [fn]):上述两个方法的toggle方法

.fadeTo([sec], opacity, [fn]): opacity参数规定元素淡入淡出的不透明度,值介于0~1之间,0为透明,1为不透明。

滑动和淡入淡出结合

.show([sec], [fn]): .slideUp.fadeIn两个方法的结合

.hide([sec], [fn]): .slideDown.fadeOut两个方法的结合

自定义动画

.animate(cssProperties, [sec], [fn]): 第一个参数是一个对象,规定css属性。例如:{height: "300px"},其中键可以是使用连字符的键,也可以是小驼峰式命名的键,值的部分是一个字符串,字符串中的数值可以是相对值,比如{height:"+=300px"}

预定义值: show, hide, toggle,这些值可以替换数值,使之显示消失或者toggle。

注意:cssProperties中定义的css属性是同时变化的,如果想让他们先后变化,可以使用两次.animate方法

延迟执行

.delay(sec) : 在两个动画效果之间调用该方法,可以在两次动画之间插入延迟时间

停止执行

.stop([clear], [toend]: 两个参数均为bool类型的参数,默认值都为false

现假设有两个动画A和B,A正在执行
如果调用默认参数的stop方法,那么A将会停止执行,立即执行B动画,而且A动画的回调函数将不会执行
如果第一个参数为true,那么A和B都将停止执行,回调函数都不会执行
如果第二个参数为true,那么A将会迅速执行完毕,回调函数会执行,然后执行B
如果两个参数均为true,那么A将会迅速执行完毕,回调函数会执行,B不会执行

finish():类似于stop的第二个参数,将会将当前动画立即执行完毕。

0 0