使用jQuery设置手的图像动画，使其摆动

我想用jQuery为角色的手设置动画，使其看起来像是在向某人挥手。 我尝试交换了两张图片（一只手指向左边，一只手指向右边）。但它不是很平滑。。。 有更好的解决办法吗？我还尝试使用jQuery插件来旋转图像，但我找不到一个可以工作的插件（与IE8兼容）。

---

谢谢你的帮助

当然，创建一个图像精灵

[1/7手][2/7手][3/7手][4/7手][5/7手][6/7手][7/7手]

在一幅图像中，将手的边界设置为一个元素，并使用jquery循环元素的背景位置

这个答案应该让你开始：

var c = 0 ;
function loop(){
  c = ++c % 7; // Reminder the number of images (7)
  $('#hand').css({backgroundPosition: (240*c)+'px 0px'}); // 240 = one image/sprite width
}
setInterval(loop, 25);

---

正如roXon所说，您可以这样做，这也很有用：看看CSS3/可以创建动画

---

确实需要厂商前缀（见演示），并且在当前浏览器（包括IE10）中受支持。

我不知道Flash，所以我考虑了jQuery（projet的所有其他动画也都是用jQuery完成的）。我不能使用CSS3，因为它与IE8不兼容。还有其他简单的选择吗？动画gif怎么样？你需要至少三帧，也许更多的帧才能有一个“平滑”的动画。你也可以使用“精灵”技术。谢谢，我会试试的！

.waving-anim {
    animation:wave 500ms infinite;
    transform-origin:bottom left;
}

@keyframes wave {
    0% {
        transform:rotate(3deg);
    }
    50% {
        transform:rotate(-3deg);
    }
    100% {
        transform:rotate(3deg);
    }
}