CSS3/Jquery自动旋转动画

以下是JS fiddle链接：

和CSS：

.hanging-div {
    transition:all 1s;
    -moz-transition:all 1s;
    -webkit-transition:all 1s;
    -o-transition:all 1s;
    transform-origin:0% 0%;
    -moz-transform-origin:0% 0%;
    -webkit-transform-origin:0% 0%;
    -ms-transform-origin:0% 0%;
    -o-transform-origin:0% 0%;
}

.hanging-div:hover {
    transform:rotate(30deg);
    -ms-transform:rotate(30deg);
    -moz-transform:rotate(30deg);
    -webkit-transform:rotate(30deg);
    -o-transform:rotate(30deg);
}

在悬停和向外悬停时，div将设置动画。我想让它保持动画连续（有点类似于钟摆）。我怎样才能做到这一点

---

N.B.有没有一种方法可以通过jquery实现相同的动画？

为什么不简单地使用CSS

@关键帧

创建一个具有无限

动画迭代计数的动画

：

@-moz-keyframes pendulum {
    50% {
        -moz-transform:rotate(30deg);
    }
}

@-ms-keyframes pendulum {
    50% {
        -ms-transform:rotate(30deg);
    }
}

@-o-keyframes pendulum {
    50% {
        -o-transform:rotate(30deg);
    }
}

@-webkit-keyframes pendulum {
    50% {
        -webkit-transform:rotate(30deg);
    }
}

@keyframes pendulum {
    50% {
        transform:rotate(30deg);
    }
}

.hanging-div {
    font-weight:600;
    text-align:center;
    color:#fff;
    margin:0 auto;
    display:block;
    width:200px;
    padding:50px 0;
    background:#f00;
    -moz-animation: pendulum;
    -moz-animation-iteration-count: infinite;
    -moz-animation-duration: 2s;
    -moz-transform-origin: top left;
    -ms-animation: pendulum;
    -ms-animation-iteration-count: infinite;
    -ms-animation-duration: 2s;
    -ms-transform-origin: top left;
    -o-animation: pendulum;
    -o-animation-iteration-count: infinite;
    -o-animation-duration: 2s;
    -o-transform-origin: top left;
    -webkit-animation: pendulum;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 2s;
    -webkit-transform-origin: top left;
    animation: pendulum;
    animation-iteration-count: infinite;
    animation-duration: 2s;
    transform-origin: top left;
}

---

.

如果使用jQuery UI，您必须能够使用switchClass（）设置动画。一个非常简单的方法来实现CSS动画：）你会写简短的吗？我理解switchClass（），但是如何实现呢@PENDOIt只需创建两个类，并为第一个类设置动画，完成第二个类，如此简单on@PENDO哦，明白了。谢谢。这很有帮助，有没有办法用jquery获得同样的效果？如果有，怎么办？谢谢