Jquery 悬停子项,否定父项悬停效果

标签 jquery css

我目前有很多代码,所以手动执行此操作不可行,但是当任何元素悬停在上面时,我需要它来缩放大小。显然,使用 css 并不难,但是当子元素悬停时我遇到了一些问题,而父元素悬停状态仍然存在。所以如果 child 被悬停, parent 和 child 都会被放大。使用 jquery 对于特定的子元素和父元素来说并不难,但是不可能为每个父元素和子元素编写代码。

我要问的是,有没有一种方法可以使用 jquery 使它在悬停的任何元素上都添加 css,而且当悬停子项时也会删除父悬停效果。因此,如果 child 被悬停,父悬停效果将被移除。 Adblock 就是这样做的。动图解释了我的意思 - https://gyazo.com/c9348ba943cace723e569e4ace69dd62

最佳答案

这段代码创造了奇迹

$("div").hover(
function (e) {
    e.stopPropagation();
    $(this).addClass('active').parents().removeClass('active');
},
function (e) {
    $(this).removeClass('active').parent().addClass('active');
}
);

归功于 https://stackoverflow.com/a/32492163/6677578

关于Jquery 悬停子项,否定父项悬停效果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39941994/

相关文章:

jquery - TextArea 中的字长错误

javascript - 克隆的自动完成输入不起作用

javascript - 如何使用 AJAX/JQUERY 和 PHP 使按钮在第一次点击后可重用

jquery - 如何让我的 Overlay 不覆盖我的下拉内容?

twitter-bootstrap - 是否有任何解决方案可以在不破坏图像的情况下显示一系列大小不同且高度相同的图像?

javascript - 如何用 "..."替换宽度超过 50 px 的字符串的一部分?

javascript - 当元素的底部边缘滚动到 View 中时使元素固定

javascript - 如何处理 AJAX 中的列表?

javascript - 做 div :after content actually modify width? 我的转换不工作

javascript - 将 CSS 和 JS 限制为 Rails 引擎