Does your plugin have the option to show TEXT on IMAGES on HOVER in gallery?

  • Resolved kristinubute

    (@kristinubute)


    5 days, 3 hours ago

    Hi

    My client has several galleries that we use in your plugin.

    Does your plugin have the option to show TEXT on IMAGES on HOVER in gallery?

    Basically we need a brief description on each image and would like that Description displayed on Mouse Over/Hover if possible ? Hopefully it has this feature, and IF SO, HOW do I achieve this?

    Also will it work somehow on mobile to view the TEXT also then?

    Thanks Kristin

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter kristinubute

    (@kristinubute)

    HI

    I’ve partly figured it out as I found some instructions in google

    https://fooplugins.com/foogallery-hover-effects/

    HOW can I make the text larger on the hover please?

    I found this code I can edit:

    .foogallery .fg-caption-desc {
    font-size: 24px !important;
    }

    And I also found a section in your plugin where you can add separate code for particular gallery.

    Add any custom CSS to target this specific gallery. For example #foogallery-gallery-2289 { }

    So is it best to add it in individual gallery in the code above ? Please advise.

    Thanks

    Plugin Support elviiso

    (@elviiso)

    Hi @kristinubute

    You can use the following CSS to make the caption and description larger on hover. You can modify it to your preference:

    .foogallery .fg-caption-title,
    .foogallery .fg-caption-title a,
    .foogallery .fg-caption-desc,
    .foogallery .fg-caption-desc a{
        transition: font-size 0.3s ease; /* Smooth transition for size change */
    }

    .foogallery .fg-caption-title:hover,
    .foogallery.fg-caption-title a:hover,
    .foogallery .fg-caption-desc:hover,
    .foogallery .fg-caption-desc a:hover{
        font-size: 20px; /* Larger font size on hover, adjust as needed */
    }

    Thanks.

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.