使用 jQuery 旋转图像 onclick。通过单击交换/更改图像答案

【问题标题】：Rotate images onclick with jQuery. Swap / change image with click使用 jQuery 旋转图像 onclick。通过单击交换/更改图像
【发布时间】：2012-08-22 13:09:37
【问题描述】：

我总共有 2 张图片。我只希望显示第一个，隐藏第二个。

然后，当我单击图像时，它会将图像交换到第二个图像，然后我再次单击它会返回到第一个，在一个循环中，每次单击都会不断交换图像，例如 1、2、1， 2、1、2 等等。

干杯

【问题讨论】：

请分享您到目前为止所尝试的内容。

标签： jquery image rotation swap

【解决方案1】：

html:

<img src="URL" id="image1" />
<img src="URL" id="image2" style='display:none;'/>

jquery:

 $("#image1").click(function ( event ) {
      $(this).hide();
      $("#image2").show();
    });
 $("#image2").click(function ( event ) {
      $(this).hide();
      $("#image1").show();
    });

【讨论】：

【解决方案2】：

也许你可以使用这个：http://code.google.com/p/jqueryrotate/

【讨论】：

这根本不是 OP 想要的

【解决方案3】：

你可以尝试使用 jQuery 的 CSS 函数，例如；

$('.image').toggle(
function() {
    $('#img1').css({ 'display':'none' });
    $('#img2').css({ 'display':'inline' });
}, function() {
    $('#img2').css({ 'display':'none' });
    $('#img1').css({ 'display':'inline' });
});

Here 是一个有效的现场演示

【讨论】：