0

I'm working on a userscript that adds a missing feature to a 3rd party website over which I have no control.

It will compute URLs based on the page and the results of some webAPI calls. These URLs will be added into the HTML of the page.

Then for any URL rendered as :visited I wish to set the li element that it is a part of to be "faded" by manipulating the styles.

That's probably more specific detail of my project than necessary to describe my problem, sorry.

The only part I'm not sure how to achieve is how to get the li element (as well as all rendered within it) to be rendered as half-faded into the background colour.

I'm guessing there is probably standard way to do this with modern HTML and CSS.

I'm working with latest stable Chrome and do not need to support old browsers.

hippietrail
  • 15,848
  • 18
  • 99
  • 158

1 Answers1

1

Is there a way to style an element such that it and all its contents will be rendered 50% faded?

Opacity

yourelement {
opacity:0.5;
}

This will affect the element and since it is inherited, it will apply to all the children too.

Note however, that if the link is :visited the opacity will have to be set by javascript as there is no CSS "Parent Selector".

Paulie_D
  • 107,962
  • 13
  • 142
  • 161