1

我希望有人可以帮助我使用以下脚本：

jQuery(document).ready(function($) {
  $(".infoBoxBtn a").click(function(e){
      e.preventDefault();
      $("#info-box").animate({marginTop: '67px'}, 2000, 'easeOutBounce');

      $(".infoBoxBtn a").addClass("active");
  });

  $(".infoBoxBtn a.active").click(function(e){
      e.preventDefault();
      $("#info-box").animate({marginTop: '-434px'}, 2000, 'easeOutBounce');

      $(".infoBoxBtn a").removeClass("active");
  });

});//end

这是我在 Safari 中遇到的错误：

TypeError: 'undefined' is not a function (evaluating 'f.easing[i.animatedProperties[this.prop]](this.state,c,0,1,i.duration)')

我在 jQuery API 网站上阅读了有关 jQuery Animate 的文章，但我不知道我在这里做错了什么。

谢谢！:)

4

1 回答 1

5

关于您的原始答案 - 您需要加载jQuery UI 效果库。

关于结束动画，我会重构您的代码以检查每次单击锚点以检查当前状态。

考虑这段代码：

$(function() {
  $('.infoBoxBtn a').on('click', function (e) {
    e.preventDefault();
    t = $(this);
    if (t.hasClass('active')) {
      margin_top = '-434px';
    }
    else {
      margin_top = '67px';
    }

    $('#info-box').stop(true, true).animate({ marginTop : margin_top }, 2000, 'easeOutBounce');
    t.toggleClass('active');
  });
});

我改变了几件事：

  • 使用.on()而不是 bind()/click()
  • 使用 .hasClass() 和 .toggleClass()
  • 使用.stop()清除之前的动画并跳转到最后。
于 2012-07-05T01:48:44.797 回答