Nikolay
Nikolay

Reputation: 225

Catching a CSS change with jQuery

What I want to do is find out when a CSS value has been changed for an element THROUGH CSS. Let's say the background-color has been changed to something else. For example by using :hover.

At first I thought that Mutation Observer would resolve this but I was wrong. When there's a change to the style of an element inside the CSS file it doesn't affect the style attribute for that element. For example, let's say I have an element with an id "test":

$('#button').click(function () {
    $('#test').css('backgroundColor', 'blue');
});

This is being detected by the Mutation Observer as a style change.

However doing this in the CSS file doesn't trigger an event:

#test:hover
{
    background-color: blue;
}

So what I am asking is - Is there a way to find out, preferably using jQuery, when a change has been made in the CSS file for an element?

Upvotes: 0

Views: 311

Answers (1)

user1017882
user1017882

Reputation:

No, unfortunately not (unless it was changed by javascript - which it's not in your case).

The only thing left for you to do would be to specify why you're wanting to do this, and maybe there'll be a way of meeting your requirements in a different way. You may be falling victim to the XY problem here:

https://meta.stackexchange.com/questions/66377/what-is-the-xy-problem

NOTE: Obviously, which the use of constant polling of the background-color of your element you can achieve this to a certain degree of accuracy (depends on the frequency of your check), but I wouldn't advise this .

Upvotes: 1

Related Questions