禁用a：当某些元素可见时悬停样式; [英] Disable a:hover styles when some element is visible;

问题描述

感谢Nick Craver，我得到了这个工作。它是什么，它显示隐藏基于某物的可见状态的类。

Thanks to Nick Craver, I got this working. What it does, it shows hides a class based on the visible state of something.

$('#btCategoriaA').click(function() {
  $('#listaCategoriaA').slideToggle('slow', function() {
    $('#btCategoriaA').toggleClass('selecionado', $(this).is(':visible'));
  });
});

基于同样可见的东西，我想禁用a：hover，或者清空a：hover lines ...不知道如何。关键是：如果有可见的东西，不要应用我的css的a：hover。

Based on the same visible of that something, I would like to "disable" the a:hover, or to empty the a:hover lines... not sure how. The point is: If something is visible, to NOT apply the a:hover of my css.

这里有任何线索吗？

EDIT
我有以下css：

EDIT I have the following css:

#listaCategorias li.categoriaA a:hover {
    background-position: 0px -79px;
}

#listaCategorias li.categoriaA a:active {
    background-position: 0px -158px;
}

#listaCategorias li.categoriaA .selecionado {
    background-position: 0px -158px;
}

HTML部分：

<ul id="listaCategorias">
  <li class="categoriaA"><a id="btCategoriaA" href="#">Categoria A</a></li>
  <li class="categoriaB"><a id="btCategoriaB" href="#">Categoria B</a></li>
  <li class="categoriaC"><a id="btCategoriaC" href="#">Categoria C</a></li>
</ul>

感谢，
MEM

Thanks, MEM

推荐答案

您可以给这个新类加上：hover 原始样式，例如：

You could just give that new class with :hover the original styling, for example:

a, a.selecionado:hover { color: black }
a:hover { color: red; }

这样， a.selecionado：hover 选择器更具体，所以原来的非悬浮样式赢了。

This way the a.selecionado:hover selector is more specific, so the original non-hover styling wins out.

这篇关于禁用a：当某些元素可见时悬停样式;的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！