Changing current image on hover with jQuery

Question

I have a showcase on my new website which I am building at the moment. When hovering over an image at the showcase I want to give it some jQuery effects. I give the current item I hover over an extra class. Then I give another class within the hover class the action to slide down. View my code below.

$(".itemContainer").hover( function () { $(this).addClass('itemHover'); }, function () { $(this).removeClass('itemHover'); } ); $('.image-hover-over').mouseover( function () { $('.itemHover .image-hover-bg').slideDown(); } );

The problem is that at the second mouseover it seems like he doesn't recognize the .itemHover yet. Because when I do the following it works, but for all items.

$('.image-hover-bg').slideDown();

After that it seems to work also with the .itemHover, but the first time it doesn't and I tried a lot and searched the web but couldn't get any useful tips.

Could anyone tell me how I can give the item I am hovering some effects?

stacktrace · Accepted Answer · 2012-10-25 17:59:37Z

2

You should do the slideDown() in the hover() handler. You don't have to define a handler for mouseover.

answered Oct 25, 2012 at 17:59

stacktrace

3191 silver badge5 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Changing current image on hover with jQuery

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related