我有一个风格的div。
这种风格
body .d:hover
{
background-color:red;
}
但是我希望(如果可能的话)Jquery会停止这种悬停行为。
我试过
$(".d").hover(function () { return false;});
$(".d").mouseenter(function () { return false;});
没什么帮助。
任何帮助?
这里是JSBIN (我希望按下按钮后 - 悬停时不会发生任何事情。)
答案 0 :(得分:1)
为CSS添加新定义:
.d.no-hover:hover {
background-color: black;
}
现在您只需将no-hover
类添加到不再具有悬停效果的元素中:
$(obj).addClass('no-hover');
答案 1 :(得分:1)
可能是这种伎俩:http://jsbin.com/akunew/14/edit
<div style="border:solid 1px red;height:100px;width:100px;" class="d"> </div>
<input type="button" value="stop this hover" onclick="stop()" id="btn"/>
删除课程:
function stop(){
$(".d").addClass('e').removeClass('d');
}
答案 2 :(得分:1)
如果您想要不断停止此行为,可以根据W3C wiki删除样式表规则:
function stop(m) {
$.each(document.styleSheets, function(i, sheet) {
$.each(sheet.rules, function(i, rule) {
if (new RegExp(m + "\\s*:hover").test(rule.selectorText)) {
sheet.deleteRule(i);
} // TODO: improve RegExp
});
});
}
stop(".d");
如果要在不删除的情况下更改状态,可以选择更改styleSheet.disabled
属性,以防在单独的样式表中设置:hover
规则。
注意,我不确定这里的兼容性问题,还应该另外确定。
答案 3 :(得分:0)
当您致电onclick="stop(this)"
时,input
将$(obj)
,而不是您的元素.d
。
编辑没有用于删除:hover
答案 4 :(得分:0)
基于你的JSBIN示例。下面的代码将起作用
功能停止(obj) { $(obj).hover(function(){ $(本)的CSS( '背景色', '白'); return false;}); $(obj).mouseenter(function(){ $(本)的CSS( '背景色', '白'); return false;});
$('body').append('<style>body div.d:hover {background-color:transparent !important}</style>');
}
你有覆盖:悬停该特定元素的css
答案 5 :(得分:0)
<强> CSS 强>
.d:hover
{
background-color:Red;
}
.noClass
{
background-color:none;
}
<强>的JavaScript 强>
function stop()
{
$(".d").addClass('noClass').removeClass('d');
}
答案 6 :(得分:0)
我使用了一个技巧 - 当我将鼠标悬停在一个元素上(并单击该HOVERed元素内的某些内容)时,您可以使用此javascript方法取消该悬停css:
document.getElementById('sarchevi').className='active';
//on mouse move, remove class
(function(){
var moved = false
window.onmousemove = function(e)
{ if(!moved){ moved = true; document.getElementById('sarchevi').className ='a'; } }
})()
答案 7 :(得分:0)
我知道这个问题已有四年了,但未来的访问者应该了解解决这一特定问题的现代方法。
您可以使用一个简单的解决方案(在其核心)使用CSS属性,并且除了IE&lt;之外的所有浏览器都支持该解决方案。 11。
$('.d').css('pointer-events', 'none');
您也可以从Bootstrap中复制此特定类:
.disabled {
pointer-events: none;
}
然后通过jQuery应用它:
$('.d').addClass('disabled');
但请注意,此CSS属性会阻止元素捕获任何DOM事件(例如悬停,但单击等)