当前位置:嗨网首页>书籍在线阅读

36-讨论

  
选择背景色: 黄橙 洋红 淡粉 水蓝 草绿 白色 选择字体: 宋体 黑体 微软雅黑 楷体 选择字体大小: 恢复默认

7.8.3 讨论

通过包含缓动程序库,可以在 options 参数的 easing 属性中指定大范围的值。 animate 方法还支持第三个参数 easing ,所以前一个解决方案可以写成如下形式:

$('.box').animate({ scrollTop: '+=100' }, 400, 'easeOutElastic');

为了创建自己的自定义缓动函数,可以使用如下代码扩展 easing

jQuery.extend(jQuery.easing, {
  customEasing: function(x, t, b, c, d) {
   return c*(t/=d)*t + b;
  },
});

上述例子和 easeInQuad 缓动效果相同。所有缓动函数都有5个参数:

fraction

动画的当前位置,以0(动画开始处)~1(动画结束处)之间的时间表示。

elapsed

自动画开始以来的毫秒数(很少使用)。

attrStart

动画变动的CSS属性开始值。

attrDelta

动画变动的CSS属性开始和结束值之间的差别。

duration

动画持续的总毫秒数(很少使用)。