2012-08-22 227 views
1

我总共有2张图片。我只想显示第一个,隐藏第二个。使用jQuery旋转图像。点击交换/更改图片

然后,当我点击图像时,它会将图像替换为第二张图像,然后再次点击回到第一个图像,在循环中,每次点击都会不断地交换图像,如1,2,1 ,2,1,2等等。

干杯

+0

请分享到目前为止,你已经尝试了什么。 – Blazemonger

回答

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(); 
    }); 
0

你可以试试这个使用jQuery的CSS功能等;

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

Here是一个工作现场演示