强制元素状态悬停在另一个悬停元素的函数中 / jQuery

Question

我看到了很多关于状态悬停和 jQuery 的事情，但对我的问题一无所知。当另一个 class 为 :hover 时，我想强制 class 变为 :hover。很难在这里解释我的代码：

$(document).mousemove(function() {    
if($('.h').is(':hover')){ 
    $('.h .btn-1e').trigger('mousover');
}
});

事实是第二次 class 悬停有点复杂，我无法通过 addClass / removeClass 完成（悬停包括 :after 东西，动画等..)

感谢您的帮助，抱歉我的英语不好！

Answer 1

我通常触发这样的事件：

$(document).mousemove(function() {    
    if($('.h').is(':hover')){ 
        $('.h .btn-1e').mouseover();
    }
});

你试过了吗？

Answer 2

我会这样做：

定义你自己的新悬停class（我知道你写过，你的悬停css很复杂但是你当然可以用悬停class代替你的悬停，在这里你也可以添加 :after ...):

.class1,
.class2 {
    width: 40px;
    height: 40px;
    margin: 30px;
    background-color: gray;
}
/* your element has an additional hover class */
.class1.hover,
.class2.hover {
    background-color: red;
}

现在在悬停事件函数中设置悬停 class jquery:

$(".class1, .class2").hover(function() {
    //mouseenter
    $(this).addClass("hover");
}, function(){
    //mouseleave
    $(this).removeClass("hover");
});

现在你可以说，当鼠标悬停在 class1 元素上时，所有 class2 元素都应该变为悬停状态（即你的悬停 class）：

$(".class1").mouseenter(function() {
    //on hover class1 force hover state to class2
    $(".class2").mouseenter();
}).mouseleave(function() {
    //remove it on mouseleave
    $(".class2").mouseleave();
});

我给你做了一个 jsfiddle 来玩：https://jsfiddle.net/0txLn21c/1/

有关更多信息，您可以阅读 API:

https://api.jquery.com/hover/

https://api.jquery.com/mouseover/

我希望，这可以帮助你，我不知道你的代码，但我认为在你的情况下使用悬停 class 并非不可能。例如，您可以将鼠标悬停 class 设为 :after 元素或动画：

.class1.hover:after {
    /* content, animations ... */
}

强制元素状态悬停在另一个悬停元素的函数中 / jQuery

Force element state hover in function of another hovered element / jQuery

jquery

hover