CODEWITHSUNDEEP
jquery
J82
J82

Reputation: 1785

jquery - thumbnails fading altogether instead of only the one I have my mouse over

I have a few thumbnails set up to fade on hover and reveal the post metadata. The problem is when I hover over one thumbnail, all of them fade.

You can see what I mean here: http://jsfiddle.net/LDs6C/10/

How can I make it so only the thumbnail I'm hovering over fades?

Upvotes: 1

Views: 122

Answers (1)

Frédéric Hamidi
Frédéric Hamidi

Reputation: 263077

You're still matching all the images and descriptions in your hover handler. You should restrict the selectors to the current thumbnail, e.g. by using this as the selector context:

$('.thumbnail').hover(function() {
    $('img', this).stop(true, true).fadeTo(400, 0.2);
    $('.description', this).stop(true, true).fadeIn(400);
}, function() {
    $('img', this).stop(true, true).fadeTo(400, 1);
    $('.description', this).stop(true, true).fadeOut(400);
});

Updated fiddle here.

Upvotes: 1

Related Questions