CSS旋转轮5秒后停止?(CSS spinning wheel stop after 5 seconds?)
我正在使用我在小提琴上找到的这个CSS代码来旋转我的轮子:
http://jsfiddle.net/gaby/9Ryvs/7/
div { margin: 20px; width: 100px; height: 100px; background: #f00; -webkit-animation-name: spin; -webkit-animation-duration: 4000ms; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; -moz-animation-name: spin; -moz-animation-duration: 4000ms; -moz-animation-iteration-count: infinite; -moz-animation-timing-function: linear; -ms-animation-name: spin; -ms-animation-duration: 4000ms; -ms-animation-iteration-count: infinite; -ms-animation-timing-function: linear; animation-name: spin; animation-duration: 4000ms; animation-iteration-count: infinite; animation-timing-function: linear; } @-ms-keyframes spin { from { -ms-transform: rotate(0deg); } to { -ms-transform: rotate(360deg); } } @-moz-keyframes spin { from { -moz-transform: rotate(0deg); } to { -moz-transform: rotate(360deg); } } @-webkit-keyframes spin { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); } } @keyframes spin { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
基本上我想在1800 Degress之后完全停止旋转,然后回到0,以便稍后再旋转它。
这可能吗?
I am using this CSS code I found on fiddle to spin my wheel:
http://jsfiddle.net/gaby/9Ryvs/7/
div { margin: 20px; width: 100px; height: 100px; background: #f00; -webkit-animation-name: spin; -webkit-animation-duration: 4000ms; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear; -moz-animation-name: spin; -moz-animation-duration: 4000ms; -moz-animation-iteration-count: infinite; -moz-animation-timing-function: linear; -ms-animation-name: spin; -ms-animation-duration: 4000ms; -ms-animation-iteration-count: infinite; -ms-animation-timing-function: linear; animation-name: spin; animation-duration: 4000ms; animation-iteration-count: infinite; animation-timing-function: linear; } @-ms-keyframes spin { from { -ms-transform: rotate(0deg); } to { -ms-transform: rotate(360deg); } } @-moz-keyframes spin { from { -moz-transform: rotate(0deg); } to { -moz-transform: rotate(360deg); } } @-webkit-keyframes spin { from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(360deg); } } @keyframes spin { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }
Basically I want to stop the spinning exactly after it reaches 1800 Degress, and then go back to 0 so I can spin it again later.
Is that possible to do?
原文:https://stackoverflow.com/questions/17053544
更新时间:2023-07-23 18:07
最满意答案
通过调用selectMovie()函数替换.then(selectRandom)及其后的所有内容。
Replace .then(selectRandom) and everything after it by calling your selectMovie() function.
相关问答
更多-
TCP/IP模型是一个________。[2023-10-02]
a -
下列中不属于面向对象的编程语言的是?[2022-05-30]
a -
您可以将条件then处理程序附加到条件本身中返回的promise,就像这样 readFile('example.json').then(function (file) { return Promise.each(EJSON.parse(file), function (entry) { return Entries.insertSync(entry); }); }).then(function () { if (process.env.NODE_ENV === 'de ...
-
有条件的承诺链?(Conditional promise chaining?)[2023-09-18]
您可以在一行中执行此操作,如您的问题格式所暗示的那样: (userisBuyer ? Order.Create() : Order.Create.As.Buyer()).then(function() { //do same stuff for both }); 但你真的想要吗? var createMethod = userisBuyer ? Order.Create : Order.Create.As.Buyer; createMethod().then(function() { }); ... -
取消承诺链?(Cancel a promise chain?)[2022-05-28]
你必须在每个链式方法中检查状态(是否应该取消): var userRequestedCancel = false; this .getData() .then(function() { if(userRequestedCancel) { return Promise.reject('user cancelled'); } return getMoreData(); }) .then(function() { if(userReq ... -
我如何打破承诺链?(How do I break a promise chain?)[2022-12-15]
您可以在else块中throw一个Error ,然后在promise链的末尾catch它: var p = new Promise((resolve, reject) => { setTimeout(function() { resolve(1) }, 0); }); p .then((res) => { if(false) { return res + 2 } else { // do something and break ... -
通过调用selectMovie()函数替换.then(selectRandom)及其后的所有内容。 Replace .then(selectRandom) and everything after it by calling your selectMovie() function.
-
承诺链 - 参考与当时(Promise chain - reference vs then)[2022-04-03]
存在根本区别,因为在第二种情况下 ,您返回的最终承诺p2将始终只返回值2 ,而不会链接其代码的其余部分,这些代码也将运行但不会以任何方式影响返回的p2解析的值。 一个简单的例子是这样的: var p = new Promise(res => res(1)); p = p.then(() => new Promise(res => res(2))); p = p.then(() => new Promise(res => res(3))); p.then(v => console.log(v)); 与 v ... -
如果在最后.then()我会做这个window.setTimeout(1, download_resources); 这完全没有意义,原因有两个: 人为地拖延任何东西都没有意义。 您的承诺代码已经异步。 您将无法从您的承诺链返回download_resources的结果 What if in last .then() I will be do this window.setTimeout(1, download_resources); That makes absolutely no sense, for ...
-
承诺链(Chain of promise)[2023-05-14]
您的问题是您没有从showOff函数返回Promise。 其实你什么也没回来。 代码return Promise.resolve(message); 返回为setTimeout创建的匿名函数, 而不是 showOff 。 所以你必须返回这样的承诺: var showOff = function (phone) { var message = 'Need New Phone ' + phone.color + ' ' + phone.brand + ' phone'; ...