Thread

Hi,
I need some assistance with an expression engine/jquery problem.

I am using a jquery plug in to fade in specific products upon page load. This works fine until you hover over one of the listings then it just stops.

You can see for yourself here:

http://www.thecapetable.com/index.php/products/view/category/tableware

What happens is, upon page load each <li> will fade in one at a time, however if you hover over one of the products while it’s loading they will all pause and only a few will be visable.

Anyone know what the problem could be?

Thanks,
James.

The plugin uses

.stop()

for it’s effect on mouse in and mouse out which I think is terminating the rest of the jQuery script from loading the rest of the thumbs as they are still there in the source (obviously).

Maybe only have this bit of the script kick in when every element has finished loading.

$(settings.element).hover(
    
        //mouse in
        function () {                                                  
            $(this).stop().animate({opacity: settings.high_opacity}, settings.timing); //100% opacity for hovered object
            $(this).siblings().stop().animate({opacity: settings.low_opacity}, settings.timing); //dimmed opacity for other objects
        },
        
        //mouse out
        function () {
            $(this).stop().animate({opacity: settings.start_opacity}, settings.timing); //return hovered object to start opacity
            $(this).siblings().stop().animate({opacity: settings.start_opacity}, settings.timing); // return other objects to start opacity
        }
    );

edit