Black & White Hover Effect for Essential Grid Items

Use the following CSS to add a black and white / gray-scale effect for your grid items.

With the following CSS, your grid items would start out as black & white, and then transform to color on mouse hover.

Modify the “.your-item-skin-name-” part with whatever your Item Skin’s “Class Prefix” is.

For example, in the following screenshot, the “Class Prefix” is:


So with the above Class Prefix, the CSS snippet below would need to be modified from this:

.your-item-skin-name-wrapper .esg-media-poster {

to this:

.eg-item-skin-1-wrapper .esg-media-poster {