CODEWITHSUNDEEP
jqueryclassjquery-selectors
Linens
Linens

Reputation: 7942

Jquery animate on a class

Hey guys I am pretty new to JQuery and I have a question about animating on a child of a certain class.

I have the following:

    <div class="block"><img src="a.jpg" class="top"><img src="b.jpg"></div>
    <div class="block"><img src="c.jpg" class="top"><img src="d.jpg"></div>

I am calling the div with (this) and I would like to select the image with class 'top' to animate.

I have tried 

$(this, 'img.top').animate({
            opacity:0
        },400);
    })

But it doesn't work. Does anyone know the correct syntax to perform this selection? Thanks

Upvotes: 0

Views: 405

Answers (3)

Scoobler
Scoobler

Reputation: 9719

If you want to make sure you are animating on the image class="top" inside the div class="block" you could do this:

$('.block').children('img.top').animate({opacity:0},400);

Obviously if you are inside a function operating on the div with the class block, you can change to:

$(this).children('.top').animate({opacity:0},400);

See a demo here Hovering over the div will use $(this) to do the animation...

Upvotes: 1

Naftali
Naftali

Reputation: 146360

$('img.top').hover(function(){$(this).animate({
            opacity:0
        },400);});

try that ^^^^^^^
:-)

also make sure this runs when the dom is there or wrap it in:

$(function(){/*jquery stuff*/});

Upvotes: 1

SLaks
SLaks

Reputation: 888303

You need to write $('img.top', this); the context parameter is the second one.

It's equivalent to $(this).find('img.top').

Upvotes: 2

Related Questions