Question

如何使用纯JavaScript来动画从a点到b点的图片。如果没有，我可以使用除jQuery之外的任何框架？这是我到目前为止http://jsfiddle.net/kmHZt/10/

Answer 1

您可以结合使用JavaScript和CSS转换：

CSS：

.slide-elem {
    position: relative;
    -webkit-transition: 0.5s left;
    -moz-transition: 0.5s left;
    -o-transition: 0.5s left;
    transition: 0.5s left;
}
.slide-elem.triggered {
    left: 50px; // Your animation here
}

JS：

document.querySelector(".slide-elem").className += " triggered";

当然，您可以自定义所有这些以执行您想要的任何操作。有关CSS过渡的更多信息：http://www.w3schools.com/css3/css3_transitions.asp

Answer 2

除了阿尔弗雷德的答案，你还应该看看CSS动画（而不是过渡）。

这是一个很好的教程：https://developer.mozilla.org/en-US/docs/CSS/Tutorials/Using_CSS_animations

Css动画/过渡与使用javascript添加类名一起应该是足够的，除非你动画很多东西，然后我建议使用HTML 5 Canvas

如何动画从a点到b点的东西？

2 个答案: