jquery - 尝试制作旋转动画

标签 jquery html css

到目前为止,这是我尝试过的。我在控制台中没有收到错误消息,而且 div 也没有旋转 http://jsfiddle.net/B8shT/

window.i = 10000;
function dothetwist()
{
    $('#box').animate( {
        step: function(now,fx) {
            $(this).css('-webkit-transform','rotatey('+now+'deg)');
        },
        duration: window.i,
        complete: function() {
            window.i=window.i-1000;
            dothetwist();
        }
    });       
}

我做错了什么?

最佳答案

我想这就是您所需要的。 JSFIDDLE

window.i = 10000;

function dothetwist() {
  $( "#box" ).animate({
      rotate: 1000
  }, {
       step: function(now,fx) {
            $(this).css('-webkit-transform','rotate('+now+'deg)');
        },
    duration: window.i,
    complete: function() {
         window.i=window.i-1000;
            dothetwist();
    }
  });
}

$("#box").click(function() {
dothetwist();
});

附注:您可以通过将“旋转:1000”属性更改为任何其他值来控制旋转速度。

感谢@nnnnnn 让我开始。

关于jquery - 尝试制作旋转动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18142632/

相关文章:

javascript - jQuery 验证消息问题

javascript - 粘滞不工作

javascript - 使谷歌地图 iframe 嵌入响应的快速简便的方法

html - 在其他居中的 div 旁边添加 div

html - bootstrap - 子项填充父项的 100%,但不会更大

html - 无法根据导航栏中的文本长度扩展下拉菜单背景

javascript - 在文本区域中允许和号 (&)

javascript - 推特 Bootstrap 图像 slider 不会低于标题

html - 在 CSS 中从长网址添加背景图片

html - 如何使用 CSS 或 HTML 将特定的 HTML 行和列加粗?