Translate Not Working In Velocity.js

I'm having some trouble animating an element using Velocity.js. My current code does not work (it's meant to translate the element 100 pixels to the right)... $('#example').velocit

Solution 1:

You're using version 2.0.2 in your fiddle, which looks to not support that sort of syntax. Velocity hasn't updated their docs - their provided working example on codepen uses version 1.5.0, rather than their newest version.

If you want to use the transform shorthand like that, downgrade to a lower version:

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

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

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