Bruce432213 Posted May 7, 2019 Share Posted May 7, 2019 Hi, this is for an image gallery. I have certain images that have a different hover effect. When I hover over the image for the first time it bounces in the big image slot. When I hover to another image and then back to the "bounce" image it doesn't display as bouncing. In fact, no image is displayed in the big image slot. Thank you //When hover $('.photos4 li').hover( function(){ //Small hoverable image - set opacity to 1 $(this).find('img').stop().fadeTo('slow',1); //Big image -set the small image to the big image // Getting "src" attribute of the image that was hovered var path = jQuery(this).find('img').attr('src'); // Setting "src" attribute of the big image. jQuery('#big-photo img').attr('src', path).effect("bounce", 300); }, function(){ //Small hoverable image - set opacity to 0.4 $(this).find('img').stop().fadeTo('slow',0.4); //Big image -set the small image to the big image // Getting "src" attribute of the image that was hovered var path = jQuery(this).find('img').attr('src'); // Setting "src" attribute of the big image. jQuery('#big-photo img').attr('src', path).finish(); });//end hover Link to comment Share on other sites More sharing options...
Bruce432213 Posted May 7, 2019 Author Share Posted May 7, 2019 I just found out that if I put a fadeIn() just before the bounce that it works, like so: jQuery('#big-photo img').attr('src', path).fadeIn(0); jQuery('#big-photo img').attr('src', path).effect("bounce", 300); but that doesn't seem like a good practice. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now