I have mark up that toggles the hover css style using this rule. When there's a checkbox inside the panel I want to remove the background image style. Is this possible? I've tried the following although it fails.
CSS:
.StaffMode .day ul li.standard a:hover table {
background:url("test.png");
}
JS:
$("li.test table li").hover(
function () {
if($(this).children(':checked')) {
alert('need to remove the background image style'); // shows as expected
$(this).children('a').removeClass('hover'); // this doesnt work?
}
}
);
What you need to do is put some restriction on your :hover
rule, and have your JavaScript change the element so it no longer applies. Something like this:
.has-hover:hover
{
/* do whatever */
}
And then your JavaScript does this:
$(this).children('a').removeClass('has-hover');
You can't remove the :hover
but you can remove the has-hover
class, and since the rule requires both, this will prevent the .has-hover:hover
rule from being applied.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With