Mask Highlight Effect
Hello! I'm a beginner that's only self-taught by watching youtube videos. So sorry in advance if I'm lacking some common knowledge.
Anyways, when I add the ".highlight-texts" class to the body, I want the whole page to darken except the elements I've marked with a ".text" class, bring all the focus or highlighting those elements.
attempt:
The problem with my attempt is that adding a filter to an element will force its children elements to have the same effect, even if I try to add another filter to the children elements.
Is there a way to darken everything excluding certain elements regardless of where they are?
Also, I think it's worth mentioning that I'm trying to make a personal firefox extension, so it's fine if it works only on firefox
Anyways, when I add the ".highlight-texts" class to the body, I want the whole page to darken except the elements I've marked with a ".text" class, bring all the focus or highlighting those elements.
attempt:
The problem with my attempt is that adding a filter to an element will force its children elements to have the same effect, even if I try to add another filter to the children elements.
Is there a way to darken everything excluding certain elements regardless of where they are?
Also, I think it's worth mentioning that I'm trying to make a personal firefox extension, so it's fine if it works only on firefox
