Question

Jsfiddle here as you can see its moving from right to left, but how can I make it run in some kind of angle. Here it is integrated, I want to have it run from the right to the left, in the curve so pretty much on the planet.

It probably has to do something with rotate(x deg)?

Answer 1

您需要在X轴和Y轴上添加动画，以使其看起来像是在曲线上。

这是一个小提琴的例子： https://jsfiddle.net/kellyking/wug7opqs/1/

X运动在项目（点）上，Y运动在：after后面，它给出了一条曲线。您可以调整x和y值（在关键帧中）以更改曲线的角度。

"dependencies": {
"angular": "^1.5.7",
"angular-animate": "^1.5.8",
"angular-cookies": "^1.5.7",
"angular-img-http-src": "^1.0.1",
"angular-jwt": "0.0.9",
"angular-messages": "^1.5.7",
"angular-ui-bootstrap": "^2.0.2",
"angular-ui-router": "^1.0.0-beta.1",
"bootstrap": "^3.3.6",
"jquery": "^2.1.4",
"bootstrap-material-design": "^0.5.10"

您可以替换“。”与你的形象。

此代码改编自本网站上的示例： http://tobiasahlin.com/blog/curved-path-animations-in-css/

CSS Animation: TranslateX() in angle/curve?

1 个答案: