1.fadeIn(速度,[回调])通过改变所有匹配元素的不透明度来实现淡入效果,并在动画可选地触发一个回调函数后完成。这个动画只调整元素的不透明度,即所有匹配元素的高度和宽度不会改变。
参数速度(字符串,数字):三种预定速度字符串(“慢”,“正常”或“快速”)长的毫秒数值(如:1000)的一个表示动画或
回调(功能):(可选)(可选)例如600毫秒缓慢淡入一段
代码:$(“P”)淡入(“慢“)
用200毫秒快速褪色的段落,然后会弹出一个对话框jQuery代码:。“动画完成”$(“P”)淡入(“快”,函数(){
警报( )
})
2.fadeOut(速度,[回调])通过改变不透明度来实现所有匹配淡入淡出效果的元素,并在动画完成后可选地触发一个回调函数。这个动画只调整元素的不透明度,即所有匹配元素的高度和宽度不会改变。
参数速度(字符串,数字):三种预定速度字符串(“慢”,“正常”或“快速”)长的毫秒数值(如:1000)的一个表示动画或
回调(功能):(可选)功能例如与段落600毫秒缓慢褪色
代码:$(“P”)。淡出(“慢”)
200毫秒段对话
代码后迅速褪色。 $(“P”)淡出(“快”,函数(){
警报(“动画完成。”)
})
3.fadeTo(速度,透明度,[回调]),所有匹配的元素逐步调整到指定的不透明度,并可选地触发一个回调函数完成动画后的不透明度。这个动画只调整元素的不透明度,即所有匹配元素的高度和宽度不会改变。
参数速度(字符串,数字):表示动画或
不透明度(:三种预定速度弦长的毫秒值(1000例)(“慢”,“正常”或“快速”)之一号):调整0和1)的回调(功能)之间的不透明度值(数。 (可选)功能 600毫秒,以缓慢调整到0.66段,能见度的透明度有关的
码2/3。 $(“p”)的fadeTo(“慢”,0.66)$(“P”)。fadeTo(“慢”,0.66)
同款200毫秒快速调整到0.25,能见度约1/4的透明度,然后会弹出一个对话框jQuery代码:$(“P”)。 fadeTo(“快”,0.25,函数(){
警报()“动画完成。”
})
保留住动画的最后状态2113,在animation后面加上forwards就可5261以了代码如下:4102
-webkit-animation{animations 1s ease 1 forwards}
注意:动画如果只执行一次,1653通过css无法办到,可以把动画结束时的样式写入一个class中,用js在动画结束时把class赋给这个对象。
扩展资料
CSS animation 与 CSS transition 有何区别
一、指代不同
1、animation :属性是一个简写属性,用于设置六个动画属性。
2、transition:属性是一个简写属性,用于设置四个过渡属性。
二、特点不同
1、animation :animation: name duration timing-function delay iteration-count direction,规定需要绑定到选择器的 keyframe 名称。规定完成动画所花费的时间,以秒或毫秒计。
2、transition:transition: property duration timing-function delay,规定设置过渡效果的 CSS 属性的名称。规定完成过渡效果需要多少秒或毫秒。
在onTransitionEnd(swiper) 或者 onSlideChangeEnd(swiper)回调中给当前页添加动画类,其他页移除动画类,其中 swiper.activeIndex 为当前活动块的索引。