jquery选择器

Question

我在此处获取选择器时遇到问题。这个函数的作用是

1. 选择图像并在悬停时改变不透明度
2. 在悬停时选择幻灯片的 anchor 标记

如果您可以帮助我选择特定于悬停在其上的特定图像的 anchor 标记，那就太好了。我尝试了很多不同的方法，但我不太擅长语法。谢谢!

$(document).ready(function() {
        $('.workitem_photo > img').each(function() {
            $(this).hover(function() {
                $(this).stop().animate({ opacity: 0.8 }, 500);
                $(this > '.workitem_projectdetails').show('500')
            },
           function() {
               $(this).stop().animate({ opacity: 1.0 }, 500);
               $(this > '.workitem_projectdetails').hide('500')
           });

        });
    });

这是 html:

<div class="workitem branding">
   <div class="workitem_photo"><img src="<?php echo home_url( '/wp-content/themes/po/' ); ?>images/workitem/branding-1000ikc.gif" alt="1000 Islands Kayaking" /></div>
   <div class="workitem_title">1000 Islands Kayaking Identity</div>
   <div class="workitem_description">Brand development for a Kayak tour operator.</div>
   <a class="workitem_projectdetails" href="#" style="display:none;">View Project Details</a>
</div>

这是一个工作版本 my test site

Answer 1

我会用这样的东西......

$(document).ready(function() {
    $('.workitem').each(function() {
        var projectDetails = $(this).find('> .workitem_projectdetails');

        $(this).find('.workitem_photo > img').hover(function() {
            $(this).fadeTo(500, .8);
            projectDetails.show('500');
        }, function() {
            $(this).fadeTo(500, 1);
            projectDetails.hide('500');
        });
    });
});

jsFiddle .