我创建了一个充当时间栏的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或timeslow,等等。
感谢您使用JQuery,但我正在尝试在没有它的情况下执行此操作,仍在学习javascript。
答案 0 :(得分:1)
elem.style["transition-duration"]
是您可能想要修改的属性。请注意,您必须使用前缀才能使其作为跨浏览器工作,例如“-webkit-transition-duration”等。
如果你需要,还有一个很好的jQuery插件:http://ricostacruz.com/jquery.transit/
编辑:我最初提出了jQuery建议,因为问题是(错误地)用jQuery标记,但当然你可以直接修改声明的属性。