导入js包easing.js,资源有免费下载的
然后写效果:
一种方法就是配合animate,演示代码如下:
function ceshi(){
$('.yqt').animate({left : '0px'},{queue:false,duration:600,easing:"easeOutElastic"});
}
一类是用toggle()、slideUp()、slideDown()、show()、hide()等jQuery内置的动画效果来实现,演示代码如下:
jQuery Easing 插件,非常的小。美化排版后是130行左右,要是压缩了那就更小了。这个插件弥补了jquery里面的动画效果的不足,是其动画效果更加强悍。如此强大而且小的插件,如果不好好加以利用,真是浪费。很多国内的朋友就是使用其中的一些效果,几个简单的参数。很少有人整理所有效果的参数。下面是我整理出来的:
linear,swing,jswing,easeInQuad,easeOutQuad,easeInOutQuad,easeInCubic,
easeOutCubic,easeInOutCubic,easeInQuart,easeOutQuart,easeInOutQuart,
easeInQuint,easeOutQuint,easeInOutQuint,easeInSine,easeOutSine,
easeInOutSine,easeInExpo,easeOutExpo,easeInOutExpo,easeInCirc,
easeOutCirc,easeInOutCirc,easeInElastic,easeOutElastic,easeInOutElastic,
easeInBack,easeOutBack,easeInOutBack,easeInBounce,easeOutBounce,easeInOutBounce
一共这么多效果参数。字面意思已经很明白,不过想真正清楚动画的效果还得看演示。