我需要禁用鼠标悬停在整个DOM中的特定按钮(而不是所有按钮)上.请让我知道如何使用CSS类实现它.
我的按钮被禁用时,我正在使用下面的CSS类.现在我想删除使用相同类的悬停效果.
.buttonDisabled
{
Cursor:text !important; Text-Decoration: None !important;
}
Run Code Online (Sandbox Code Playgroud)
上面的类将负责删除鼠标悬停时的手势和文本下划线.现在我想删除悬停效果.请告诉我.
See*_*ngh 77
我有一个非常简单的解决方案.
只需创建一个新类
.noHover{
pointer-events: none;
}
Run Code Online (Sandbox Code Playgroud)
并使用它来禁用它上面的任何事件.使用它像:
<a href='' class='btn noHover'>You cant touch ME :P</a>
Run Code Online (Sandbox Code Playgroud)
小智 17
为此,我最终使用了内联样式,因为我只希望一个特定元素没有任何悬停单击事件或样式,因为它只是有关页面上看起来像它的其他按钮的说明的一部分,并且给它覆盖优先级。这是哪一个:
<button style="pointer-events:none"></button>
Run Code Online (Sandbox Code Playgroud)
这为我删除了单个元素上的所有样式和绑定的 JavaScript/JQuery 功能,同时不影响页面上的其他元素:)。有关详细信息,请参阅mozilla 参考资料。
Paw*_*mar 13
这是取消悬停效果的方法。
.table-hover > tbody > tr.hidden-table:hover > td {
background-color: unset !important;
color: unset !important;
}
Run Code Online (Sandbox Code Playgroud)
您可以使用:not选择器来实现:
HTML代码:
<a class="button">Click me</a>
<a class="button disable">Click me</a>
Run Code Online (Sandbox Code Playgroud)
CSS代码(使用scss):
.button {
background-color: red;
&:not(.disable):hover {
/* apply hover effect here */
}
}
Run Code Online (Sandbox Code Playgroud)
这样,您可以在未应用指定的类(.disable)时应用悬停效果样式。
添加以下内容以在禁用按钮上添加悬停效果
.buttonDisabled:hover
{
/*your code goes here*/
}
Run Code Online (Sandbox Code Playgroud)
要禁用悬停效果,我有两个建议:
$.unbind('hover'); $.removeClass('hoverCssClass');使用 CSS!important覆盖 CSS 会使您的 CSS 非常不干净,因此不推荐使用这种方法。您始终可以使用不同的类名复制 CSS 样式以保持相同的样式。
小智 7
执行此 Html,CSS 位于 head 标签中。只需创建一个新类并在 css 中使用以下代码片段:
pointer-events:none;
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<style>
.buttonDisabled {
pointer-events: none;
}
</style>
</head>
<body>
<button class="buttonDisabled">Not-a-button</button>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
从您的问题中,我所能理解的是,您已经对要删除的按钮产生了一些悬停效果。为此,要么删除导致悬停效果的 css,要么覆盖它。
对于覆盖,请执行此操作
.buttonDisabled:hover
{
//overriding css goes here
}
Run Code Online (Sandbox Code Playgroud)
例如,如果您的按钮的背景颜色在悬停时从红色变为蓝色。在覆盖的 css 中,您将把它设为红色,这样它就不会改变。
还要仔细阅读所有编写和覆盖 css 的规则。熟悉什么 css 会有什么优先级。
祝你好运。
| 归档时间: |
|
| 查看次数: |
137211 次 |
| 最近记录: |