CSS отключить эффект зависания

Мне нужно отключить наведение мыши на определенной кнопке (не на всех кнопках) во всей DOM. Пожалуйста, дайте мне знать, как достичь этого, используя класс CSS.

Я использую следующий CSS-класс, когда моя кнопка отключена. теперь я хочу удалить эффект наведения с использованием того же класса.

.buttonDisabled
 {
 Cursor:text !important; Text-Decoration: None !important; 
 } 

Вышеупомянутый класс позаботится об удалении знака руки и подчеркивания текста при наведении мыши. Теперь я хочу удалить эффект наведения. Пожалуйста, дайте мне знать.

Ответ 1

У меня действительно простое решение для этого.

просто создайте новый класс

.noHover{
    pointer-events: none;
}

и используйте это, чтобы отключить любое событие на нем. используйте его как:

<a href='' class='btn noHover'>You cant touch ME :P</a>

Ответ 2

добавить следующее, чтобы добавить эффект зависания на отключенной кнопке

   .buttonDisabled:hover
     {
       /*your code goes here*/
     }

Ответ 3

Чтобы отключить эффект зависания, у меня есть два предложения:

  • Если ваш эффект зависания вызван JavaScript, просто используйте $.unbind('hover');
  • если ваш стиль зависания запускается классом, то просто используйте $.removeClass('hoverCssClass');

Использование CSS !important для переопределения CSS сделает ваш CSS очень нечистым, поэтому этот метод не рекомендуется. Вы всегда можете дублировать стиль CSS с другим именем класса, чтобы сохранить тот же стиль.

Ответ 4

Из вашего вопроса все, что я могу понять, это то, что у вас уже есть эффект зависания на вашей кнопке, который вы хотите удалить. Для этого либо удалите этот css, который вызывает эффект зависания, либо переопределит его.

Для переопределения сделайте это

.buttonDisabled:hover
{
    //overriding css goes here
}

Например, если цвет фона вашей кнопки изменяется при наведении с красного на синий. В верхнем css вы сделаете его красным, чтобы он не изменился.

Также пройдите все правила написания и переопределения css. Ознакомьтесь с тем, какой css будет иметь какой приоритет.

Желаем удачи.

Ответ 5

Вы можете достичь этого используя: not selector:

HTML код:

<a class="button">Click me</a>
<a class="button disable">Click me</a>

Код CSS (используя scss):

.button {
  background-color: red;
  &:not(.disable):hover {
    /* apply hover effect here */
  }   
}

Таким образом вы применяете стиль эффекта наведения, когда указанный класс (.disable) не применяется.

Ответ 6

Вот способ снять эффект наведения.

.table-hover > tbody > tr.hidden-table:hover > td {
    background-color: unset !important;
    color: unset !important;
}

Ответ 7

с помощью:

.noHover{
    pointer-events: none;
}