jquery.easing.1.3

从jQuery API 文档中可以知道，jQuery自定义动画的函数.animate( properties [, duration] [, easing] [, complete] )有四个参数：
properties：一组包含作为动画属性和终值的样式属性和及其值的集合
duration(可选)：动画执行时间，其值可以是三种预定速度之一的字符串(“slow”, “normal”, or “fast”)或表示动画时长的毫秒数值(如：1000)
easing(可选)：要使用的过渡效果的名称，如：linear 或swing
complete(可选)：在动画完成时执行的函数
其中参数easing默认有两个效果：linear和swing，如果需要更多效果就要插件支持了，jQuery Easing Plugin提供了像"easeOutExpo"、"easeOutBounce"等30多种效果

演示地址：https://matthewlein.com/tools/jquery-easing
直接下载
使用方法
1.引入文件

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/jquery.min.js"></script>
<script type="text/javascript" src='js/jquery.easing.1.3.js'></script>

animate函数使用easing

$('div').animate({'left':300},3000,'easeInOutElastic',function(){
				//动画执行完毕回调函数
});

为每个属性指定easing

$('div').animate({
    left: [500, 'swing'],
    top: [200, 'easeOutBounce']

效果图解