Question

这是一个滚动到我的div锚的现有函数，但我想使用缓动，我不知道如何编辑这个添加，我已经尝试了一些东西，但没有任何工作

我试过这个

  $.fn.anchorAnimate.defaults = {
    speed: 600,
    offset: -65,
    easing:"easeOutCubic"
  };

这是现有的功能

(function ($) {
  $.fn.anchorAnimate = function(options) {
    var settings = $.extend({}, $.fn.anchorAnimate.defaults, options);

    return this.each(function() {
      var caller = this;
      $(caller).click(function(event) {
        event.preventDefault();
        var elementClick = $(caller).attr("href");

        var destination = $(elementClick).offset().top + settings.offset;
        $("html:not(:animated), body:not(:animated)").animate({ scrollTop: destination}, settings.speed, function() {
          if(0 === settings.offset) {
            window.location.hash = elementClick;
          }
        });
        return false;
      });
    });
  };

  $.fn.anchorAnimate.defaults = {
    speed: 600,
    offset: -65
  };
}(jQuery));

Answer 1

扩展程序不使用.animate()功能上的任何缓动设置。您可以这样添加：

$("html:not(:animated),body:not(:animated)").animate({ scrollTop: destination}, settings.speed, settings.easing, function() {
    // bla bla
});

......而且这个：

$.fn.anchorAnimate.defaults = {
    speed: 600,
    offset: -65,
    easing: "swing"
};

...但问题是，jQuery中没有easeOutCubic可用。检查：

jQuery库中唯一的缓动实现是默认的，叫做摇摆，一个以恒定的速度前进，称之为线性的。使用插件可以获得更多的缓动功能，最值得注意的是jQuery UI套件。

如何为此动画添加缓动

1 个答案: