Question

我似乎在努力解决这个问题。我想用按钮悬停来改变其他元素。我想要做的是，当你徘徊在＆＃34;继续阅读＆＃34;主页上的按钮，然后为标题和后期元更改颜色。

网站网址为：

http://staging.conversationlab.com/lions_valley/

Answer 1

你可能只需要添加一些css：

<style>
#buttonid:hover {
    background-color:#ff0000;
}
</style>

在按钮上声明#buttonid：

<button id="buttonid"> my button</button>

更多信息=更好的答案/ s

Answer 2

您可以在更多链接上使用hover()方法来触发将样式应用于或移除siblings的函数，例如...

$(".more-link").hover(
  function() {
    $(this).addClass("your-class-with-styling");
    $(this).siblings(".post-meta").addClass("your-class-with-styling");
    $(this).siblings("h2").addClass("your-class-with-styling");
  },
  function() {
    $(this).removeClass("your-class-with-styling");
    $(this).siblings(".post-meta").removeClass("your-class-with-styling");
    $(this).siblings("h2").removeClass("your-class-with-styling");    
  }
);

我可能会在h2中添加一个类来定位，以确保它不会与将来可能会在这些文章部分结束的任何其他h2冲突。

Answer 3

你可以在这里看到如何做到这一点。 https://jsfiddle.net/5aybmjk7/

基本上我只是在代码中添加了一个ID /附加类，然后附加了使用mouseover和mouseout的相关jquery，通过添加或删除附加了CSS的类来突出显示/取消突出显示标题。

$('#here').mouseover(function () {
    $(".highlightMe").addClass('colored');
});

$('#here').mouseout(function () {
    $(".highlightMe").removeClass('colored');
});

Answer 4

jQuery('.et_pb_posts article').find('.more-link').on('hover', function() {
    jQuery(this).find('.post-meta a').addClass('YOUR_CLASS')
});

试试

使用按钮悬停使元素改变颜色

4 个答案: