Jump to content

JQuery bounce stop working


Bruce432213

Recommended Posts

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

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

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...