我可以通过JavaScript禁用CSS：hover效果吗？

  • Z时代
  • 2024-01-10
  • 分类：问答

我试图阻止浏览器:hover通过JavaScript 使用CSS 的效果。

我在CSS中设置了a和a:hover样式，因为如果JS不可用，我希望获得悬浮效果。但是，如果 有 可用的JS

，我想用更平滑的效果覆盖CSS悬停效果（例如，使用jQuery color插件）。

我尝试了这个：

$("ul#mainFilter a").hover(
     function(e){ e.preventDefault(); ...do my stuff... }, 
     function(e){ e.preventDefault(); ...do my stuff... });

我也尝试过使用return false;，但是它不起作用。

如fudgey所述，一种解决方法是使用重置悬浮样式，.css()但我必须覆盖CSS中指定的每个属性。我正在寻找一个通用的解决方案。

有谁知道如何做到这一点？

回答：

恐怕没有纯粹的JavaScript通用解决方案。JavaScript无法关闭CSS :hover状态本身。

您可以尝试以下替代解决方法。如果您不介意在HTML和CSS中多花钱，那么您不必通过JavaScript手动重置每个CSS属性。

的HTML

<body class="nojQuery">

CSS

/* Limit the hover styles in your CSS so that they only apply when the nojQuery 
class is present */
body.nojQuery ul#mainFilter a:hover {
    /* CSS-only hover styles go here */
}

JavaScript

// When jQuery kicks in, remove the nojQuery class from the <body> element, thus
// making the CSS hover styles disappear.
$(function(){}
    $('body').removeClass('nojQuery');
)

以上是 我可以通过JavaScript禁用CSS：hover效果吗？ 的全部内容， 来源链接： utcz.com/qa/433028.html

回到顶部