在JavaScript中，如何将图像围绕自己的轴旋转360度？

我已经尝试了两天，现在找到一种方法来旋转我的图像，而我输入一个按钮。我需要帮助的是，让代码在Javascript中围绕自己的轴旋转一个名为

images[0]

的图像。我知道这看起来很难，但我也尝试过，我真的需要专业人士的帮助

下面是将图像旋转90度的示例

CSS

HMTML

基于的JSFIDLE，使用and（使用-webkit-prefix，针对其他浏览器进行修改）

CSS

HTML

R
Y

360度又回到了起点，所以你什么也做不了。但是你试过什么？你能发布你的代码和一个链接到你的JSFIDDL吗？我更想问的是，他们是否可以在按下按钮时做90度旋转，在按下另一个键时再旋转90度（我已经用输入键修复了这个部分）在90度时，图像将是侧置的，不可见，您还没有说明您尝试旋转哪个访问。我只是请求帮助将图像旋转90度，如：U（旋转90度）c或类似的内容：<（旋转90度）^这是一个简单的示例，说明了我希望对图像执行的操作。

#container {
    position: relative;
    width: 450px;
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    -o-perspective: 1000px;
    perspective: 1000px;
}
#card {
    -webkit-transform-style: preserve-3d;
    -webkit-transition: all 1.0s linear;
    -moz-transform-style: preserve-3d;
    -moz-transition: all 1.0s linear;
    -o-transform-style: preserve-3d;
    -o-transition: all 1.0s linear;
    transform-style: preserve-3d;
    transition: all 1.0s linear;
}
#container:hover #card, #container.hover_effect #card {
    -webkit-transform: rotateY(90deg);
    -moz-transform: rotateY(90deg);
    -o-transform: rotateY(90deg);
    transform: rotateY(90deg);
}

<div id="container">
    <div id="card">
        <img src="http://img844.imageshack.us/img844/2656/impreza20061sh5.jpg" />
    </div>
</div>

@-webkit-keyframes r {
    0% { -webkit-transform: rotate(0deg); }
    100% { -webkit-transform: rotate(360deg); }
}
#r:hover ~ img {
    -webkit-animation: r 2s infinite linear;
}

@-webkit-keyframes y {
    0% { -webkit-transform: rotateY(0deg); }
    100% { -webkit-transform: rotateY(360deg); }
}
#y:hover ~ img {
    -webkit-animation: y 2s infinite linear;
}

<button id="r">R</button>
<button id="y">Y</button>
<br/> <br/>
<img src="http://img844.imageshack.us/img844/2656/impreza20061sh5.jpg" />