跨图像和文本展开链接 (a)

Question

我正在使用创建以下输出的 WordPress 插件：

<li>
  <a href="/permalink1/" class="wp_rp_thumbnail"><img src="/media/image-thumbnail.png"/></a>
  <a href="/permalink1/" class="wp_rp_title">Post Title</a>
</li>

我为图像和文本应用了a:hover 样式。但当然，它们是相互独立触发的，因为生成了两个链接。我想让它们在悬停时触发（在我的情况下：图像边框颜色更改和文本颜色更改 - 无论两个元素中的哪一个被悬停）。

当然，我可以修改插件源并更改它在那里的构建方式，但由于具有更新能力，我认为用几行 jQuery 来更改它会更简洁。不幸的是，我不知道如何解决这个问题，并感谢您的想法！

Answer 1

在 li 上添加悬停

FIDDLE

li:hover img
{
    border: 2px solid green;
}
li:hover a
{
    color: orange;
}

Answer 2

使用 Jquery，您可以使用悬停功能。 像这样的

$('.wp_rp_thumbnail, .wp_rp_title').hover(function(){
    $('.wp_rp_thumbnail img').css({"border":"1px solid #fff"});
    $('.wp_rp_title').css({"color":"#fff"});
});