I have some div elements and each of them have a hover effect applied by CSS. But I don't always want this hover effect; it should only activate under specific conditions.
Now, how can I disable those hover effects using jQuery when my conditions are satisfied? What is the code for disabling hover? I don't have access to CSS files.
Just use the jQuery hover instead of the CSS one.
E.g. instead of such CSS:
#Div1:hover { background-color: yellow; }
Have this jQuery:
$("#Div1").hover(function() {
$(this).css("background-color", "yellow");
}, function() {
$(this).css("background-color", "");
});
Same effect, and you control the JS code and can have conditions.
Live test case: http://jsfiddle.net/THXuc/
.css() appends whatever is written to your cssyou can do this by using
<script>
$("someDiv").hover(function(event) {
//apply some conditions if yes
event.preventDefault();
else
return true;
});
</script>
Hope this will work for you....
Thanks
You could apply a different class to the div(s) in question, using jquery .hover(). On mousein, apply the class and on mouseout, remove it.
