you're each idea is right on track $(".logo").each(function(){ $(this).hover(function(){ /// *this* within an *each* will single out the individual .logo you hover over $(this).find(".caption").animate({opacity:"show"}, "fast");// look within this .logo only }, function(){ $(this).find(".caption").animate({opacity:"hide"}, "slow"); }); }); mojoeJohn wrote: I'm doing a logo display for my company site and I want the caption to fade in each time you hover over the logo and to fade out when you hover away. I've got that part squared away, but I wanted to know how to edit my code so that i can reuse my classes for each logo on the page. Right now if i hover over a logo, the text for each one fades in and fades out at the same time. I'm too new to scripting to know quite how to do it. I was thinking maybe using jquery's .each() method or a for each loop, but i don't know ... can anyone help put me on the right path?!here's the jquery $(document).ready(function(){ $(".logo").hover(function(){ $(".caption").animate({opacity:"show"}, "fast"); }, function(){ $(".caption").animate({opacity:"hide"}, "slow"); }); }); .logo is the over all box, and it includes .caption, which fades in html: <div class="logo"> <div class="logoHead">Liquid Video</div> <img src="" /> <div class="caption">We did the LVT logo. <!--close caption--> </div> <!--close logo--> </div> so how do i only act on one logo at a time without having to individually number each logo on the page? Thanks! (if you see this reposted multipled times, it's b/c it was never showing up after i initially posted it and i kept trying) |
- [jQuery] simple beginner question thursday0384
- [jQuery] simple beginner question mojoeJohn
- [jQuery] Re: simple beginner question jlcox
- [jQuery] Re: simple beginner question Charlie