Question

我尝试使用jquery将动画添加到div：

$('#footer').animate({ "width" : "13%" },1000);

它可以工作，但控制台中会显示错误，如：

“无法在'元素'上执行'animate'：不支持部分关键帧。”

当我点击右侧链接时：

但是当我在像素中使用值时，没有错误：

$('#footer').animate({ "width" : 68 },1000);

是否有使用响应值的解决方案？

Answer 1

问题在于您拨打.animate()的方式。您已将jQuery添加到您的代码库中，但您使用web platform's animate和.animate()调用的方式。如果你希望这可以通过jQuery更改来正常工作：

var player = this.move_.animate();

到

var player = $(this.move_).animate();

但如果您想使用jQuery上的JavaScript动画，那么您可以拥有此

var player = this.move_.animate({transform: [parameters.transformBegin, parameters.transformEnd]});

我不知道您的参数是什么，但我的示例显示您为要动画的每个属性添加多个关键帧作为数组

Answer 2

你陷入了困境。您使用的$不是jQuery，但它是控制台的API，document.querySelector

的快捷方式

这意味着$('#footer')不返回jQuery对象，而是返回纯DOM元素。

这意味着.animate不是jQuery的方法，而是元素的方法，因此您在不知情的情况下使用Web Animation API，而不是jQuery.animate。

他们有不同的API，你会收到错误。

简而言之，请确保您的网页上提供了jQuery和/或使用jQuery('#footer').animate(et cetera)

Answer 3

在这里工作正常：jsfiddle没有错误

css：

#footer {
  width:100%;
  height:100px;
  background:red;
}

我认为你得到了这个错误（＆＃34;无法执行＆＃39;动画＆＃39;元素＆＃39;：不支持部分关键帧。＆＃34;）因为元素你想要操纵（#footer）在动画之前没有给出特定的尺寸

只需width（CSS或内联）#footer，即可正常使用

让我知道是否有帮助