0

我创建了一个类似于时间栏的 css3 动画。当时间栏结束（或动画结束）时，玩家应该能够选择要使用的技能。

我目前遇到的问题是创建的代码让我可以选择专门针对时间并随意更改它，因为我使用的是 CSS 动画的简写代码。

function timeBar (el, color) {
    var elem = document.getElementById(el);
    elem.style.transition = "width 6.0s, linear 0s";
    elem.style.background = color;
    elem.style.width = "0px";
}

如您所见，条形图在 6 秒时填满，但我怎样才能编写代码，让我专门针对和更改时间，而让剩下的短手自行处理？我问是因为我想影响其他技能，例如 timestop 或 timelow 等。

感谢您提供 JQuery，但我正在尝试在没有它的情况下执行此操作，仍在学习 javascript。

4

1 回答 1

1

elem.style["transition-duration"]

是您可能要修改的属性。请记住，您必须使用前缀才能使其尽可能跨浏览器工作，例如“-webkit-transition-duration”等。

如果您愿意，还有一个不错的 jQuery 插件可以做到这一点：http ://ricostacruz.com/jquery.transit/

编辑：我最初提出 jQuery 建议是因为该问题（错误地）用 jQuery 标记，但当然您可以直接修改声明的属性。

于 2013-10-13T19:43:36.243 回答