On mouse Hover Image Gallery

Ask the Community General Questions
1

Hello,
Please create an app/add-on that gives the photo gallery on Google Sites a lively effect, so that (e.g.) when there is no mouse hovering, the photos are black and white and when the mouse hovers on a photo, it turns to color photo.
Appreciate it fellas.

Regards
Sheragim

2 Likes
3

Hi there, @Sheragim_GHAEINI :waving_hand:

I’m not sure which widget is installed on your Google Sites website, but in your account I’ve found a Photo Gallery widget with Masonry layout and default photos there:

image
image1820×987 108 KB

If you’re going to keep using the Masonry layout and the uploaded photos will be colored, this code will help you achieve the needed result:

.eapp-photo-gallery-masonry-item-item {
    filter: grayscale(100%);
    transition: filter 0.3s ease;
}

.eapp-photo-gallery-masonry-item-item:hover {
    filter: grayscale(0%);
}

It should be added to the Custom CSS field on the Style tab of your widget’s settings:


Check it out and let me know if you like the result :slightly_smiling_face:

1 Like