JQuery动画效果

jQuery动画

通过渐渐变换背景色的方式来隐藏和显示元素

其实前边的show,hide,slideDown,slideUp和本章的技术都是隐藏和显示元素，而且用法一样

show,hide：同时改变元素的宽度和高度

slideDown,slideUp：改变元素的高度

fadeIn,fadeOut:改变元素的背景色（透明度值为0.0-1.0）

淡入淡出：

fadeIn:是淡入：即元素从无到有

fadeOut:是淡出：即元素从有到无

 

fadeTo:将元素的不透明度定位到某个值

animate:自定义动画效果

animate(params,[duration],[easing],[callback])

       params表示用于制作动画效果的属性样式和值的集合

       duration:表示三种默认速度字符：‘slow’,'normal','fast'

       easing:动画插件

       callback:动画执行完成后回调的函数

 

简单动画:宽度和高度的变化效果和show方法很想，但紧紧是效果像而已，在animate中的params参数中还可以设置其他属性，如fongSize等

注:第一个参数params必须使用骆驼写法，即font-size必须写成fontSize才有效

 

移动位置:设置top和left属性的值

注意：如果想移动一个元素，就应该为其设置初始位置值，也就是设置其position属性的值为relative或者absolute

停止延迟：

$('img').slideToggle(3000);开始

$('img').stop();停止

$('img').delay(2000).slideToggle(3000);：延迟2000毫秒后继续执行，事件3000