Title: Grey until hover
Last modified: August 24, 2016

---

# Grey until hover

 *  Resolved [missnisaa](https://wordpress.org/support/users/missnisaa/)
 * (@missnisaa)
 * [11 years ago](https://wordpress.org/support/topic/grey-until-hover/)
 * Do anyone know how to make images in the gallery greyscale until hovered over?
 * Also want to know how to be able to resize images within the gallery individually.
 * Im looking for custom css in the gallery edit page.
 * [https://wordpress.org/plugins/foogallery/](https://wordpress.org/plugins/foogallery/)

Viewing 6 replies - 1 through 6 (of 6 total)

 *  Plugin Author [bradvin](https://wordpress.org/support/users/bradvin/)
 * (@bradvin)
 * [11 years ago](https://wordpress.org/support/topic/grey-until-hover/#post-6145617)
 * FooGallery uses attachments from within the WordPress media manager, so you can
   resize them from the media library.
 * Also, you can add custom CSS to the gallery via the Custom CSS metabox below 
   the gallery settings, when editing a gallery
 *  Thread Starter [missnisaa](https://wordpress.org/support/users/missnisaa/)
 * (@missnisaa)
 * [11 years ago](https://wordpress.org/support/topic/grey-until-hover/#post-6145716)
 * I was looking for resizing with the cursor rather than manually typing in sizes
   but I realise this is probably not possible.
 * I have added a custom css to change images in the gallery to be greyscale until
   hovered over.
 * But the trouble is all images turn to colour when an image is hovered over rather
   than an individual image. I am look for the correct custom css for this.
 *  Thread Starter [missnisaa](https://wordpress.org/support/users/missnisaa/)
 * (@missnisaa)
 * [11 years ago](https://wordpress.org/support/topic/grey-until-hover/#post-6145717)
 * Im using this custom css. Changes to colour only when clicked on:
 * #foogallery-gallery-147
    { filter: url(filters.svg#grayscale); /* Firefox 3.5
   + */ filter: gray; /* IE6-9 */ -webkit-filter: grayscale(1); /* Google Chrome&
   Safari 6+ */ }
 * #foogallery-gallery-147: hover
    { filter: none; -webkit-filter: none; }
 *  Plugin Author [bradvin](https://wordpress.org/support/users/bradvin/)
 * (@bradvin)
 * [11 years ago](https://wordpress.org/support/topic/grey-until-hover/#post-6145719)
 * I just added the following CSS to one of my galleries and it worked as expected:
 *     ```
       #foogallery-gallery-147 a:hover img {
       filter: none;
       -webkit-filter: none;
       opacity: 1 !important;
       }
   
       #foogallery-gallery-147 img {
       filter: url(filters.svg#grayscale); /* Firefox 3.5+ */
       filter: gray; /* IE6-9 */
       -webkit-filter: grayscale(1); /* Google Chrome & Safari 6+ */
       }
       ```
   
 *  Thread Starter [missnisaa](https://wordpress.org/support/users/missnisaa/)
 * (@missnisaa)
 * [11 years ago](https://wordpress.org/support/topic/grey-until-hover/#post-6145720)
 * now why didn’t i think of just adding ‘img’.
 * thank you so much. my brain is fried from all this learning about css.
 *  [patagas](https://wordpress.org/support/users/patagas/)
 * (@patagas)
 * [10 years, 6 months ago](https://wordpress.org/support/topic/grey-until-hover/#post-6145775)
 * Hello problem I had was not seen in black and white on Firefox. We solve looking
   for the file:
    `/ public_html / wp-content / plugins / foogallery / extensions/
   default-templates / CSS/gallery-default.css` and search `.foogallery-default.
   hover-effect-color img` and place the following `filter: grayscale (100%); / *
   Firefox * /`
 *   It worked for me so.

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Grey until hover’ is closed to new replies.

 * ![](https://ps.w.org/foogallery/assets/icon-256x256.gif?rev=2602542)
 * [Photo Gallery by FooGallery : Responsive Image Gallery, Masonry Gallery & Carousel](https://wordpress.org/plugins/foogallery/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/foogallery/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/foogallery/)
 * [Active Topics](https://wordpress.org/support/plugin/foogallery/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/foogallery/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/foogallery/reviews/)

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [edit](https://wordpress.org/support/topic-tag/edit/)
 * [gallery](https://wordpress.org/support/topic-tag/gallery/)
 * [Grey](https://wordpress.org/support/topic-tag/grey/)
 * [hover](https://wordpress.org/support/topic-tag/hover/)
 * [resize](https://wordpress.org/support/topic-tag/resize/)

 * 6 replies
 * 3 participants
 * Last reply from: [patagas](https://wordpress.org/support/users/patagas/)
 * Last activity: [10 years, 6 months ago](https://wordpress.org/support/topic/grey-until-hover/#post-6145775)
 * Status: resolved