How can I get this to change the image onClick? And then change it back to it's original state (original image)?
jQuery('.expand-one').click(function(){
jQuery('.content-one').slideToggle('fast');
});
jQuery('.expand-one').toggle(function() {
jQuery('.content-one').slideDown('slow');
jQuery(this).find("img").css({
"-webkit-transform": "rotate(90deg)",
"-moz-transform": "rotate(90deg)",
"filter": "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"
});
}, function() {
jQuery('.content-one').slideUp('slow');
jQuery(this).find("img").css({
"-webkit-transform": "rotate(0deg)",
"-moz-transform": "rotate(0deg)",
"filter": "progid:DXImageTransform.Microsoft.BasicImage(rotation=0)"
});
});
Virtually I want to change the out the IMAGE ROTATION for the IMAGE SWAPPING.
Thanks, Aaron
Change the image tag to
<img class="expand-one" src="WhateverUrl" data-altsrc="AlternateUrl">
and have the javascript as
jQuery('.expand-one').click(function(){
var src = $(this).attr("src");
$(this).attr("src", $(this).data("altsrc"));
$(this).data("altsrc", src);
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.