Show transparency of in-page images on hover

Added by myf@userstyles, Created: Jan 06, 2008, Updated: Jan 23, 2009
  • With the style applied
  • With the style applied (Generated screenshot)
  • Without the style applied (Generated screenshot)

Description:

Replaces images background by a white-grey grid while hovered, so you can see whether/how transparent it is.

Complicated selector is because of compatibility with the http://freestyler.ws/style/3447/center-images-dynamic-background, which this one initially came from (you can merge them again and prevent some duplicity of code).

Notes: obviously, does not work with "images" placed as background-images.

Change log:
2008-01-09 : added inverted dotted outline for hovered images: this will reveal whether the image is placed as real "IMG" or not.
2009-01-23 : only -> first

Notes:
- "invert" IS a valid value of "outline-color" property -- so ignore installation warning. See http://www.w3.org/TR/CSS21/ui.html#propdef-outline-color
- If you want to be sure that the hovered image is not "unnaturally" resized: http://freestyler.ws/style/102294/resize-images-to-maximum-size-when-mouse-hovers

Installs:
Applies to:
http://, https://

Related styles:

WARNING: This webware is not functioning properly. Please enable javascript in your browser and try again.