Question

我在使用Velocity.js动画元素时遇到了一些麻烦。我当前的代码不起作用（它意味着将元素向右翻译100个像素）...

$("#example").velocity({ translateX: "100px" });

然而，有趣的是，当我将其更改为以下内容时，它确实有效...

$("#example").velocity({ transform: "translateX(100px)" });

我的例子似乎与http://velocityjs.org/#transforms给出的代码相同。是否有任何明显的原因可能会发生这种情况？

这是一个用来测试我的问题的JSFiddle，https://jsfiddle.net/zwtoxxfL/2/。

Answer 1

你在小提琴中使用的是2.0.2版，它看起来不支持那种语法。 Velocity还没有更新他们的文档 - 他们在codepen上提供的工作示例使用的是1.5.0版本，而不是最新版本。

如果你想使用这样的变换速记，请降级到较低版本：

$("div").velocity({ translateX: "100px" });

div {
  background: green;
  width: 100px;
  height: 100px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/velocity/1.5.0/velocity.min.js"></script>
<div></div>

翻译不在Velocity.js中工作

1 个答案: