在运行时启用/禁用悬停样式？

Question

在我的CSS中我有这个：

#panel li:hover {
  background-color: #ffa;
}

在某种情况下，我想禁用从li项目悬停样式，例如：

function start() {
    $('#panel li').ignoreHoverRules();
}

稍后重新启用它：

function end() {
    $('#panel li').reenableHoverRules();
}

有可能吗？不确定如何在运行时“启用”或“禁用”悬停样式规则

由于

Answer 1

绝对最简单的方法是在<li>元素中添加一个类：

#panel li.allowHover:hover {
  background-color: #ffa;
}

function start() {
    $('#panel li').removeClass("allowHover");
}
function end() {
    $('#panel li').addClass("allowHover");
}

否则，你通过操纵CSS规则进入非常尴尬的领域 - it's no easy task。