WooSlider "Posts" content overlay on hover

Home Pootlepress Academy Support Forums Academy Support Forum WordPress plugins WooSlider "Posts" content overlay on hover

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #13187
    Steve Hammond

    I would like to know if and how I could make the content overlay on a slide only appear on mouseover/hovering over the slide image instead of it showing all the time?
    If not, would it be possible to have some kind of link that when clicked on brings up a box with text in and a close button to return to it just showing the link (e.g.: show/hide info)?
    I have enquired about this with the Woo team but thought it might be useful to post it here too as you might have some insight/suggestions.
    Any advise would be helpful

    Steve Hammond

    Good news, I have found a solution to this with the help of the Woo team.
    After submitting my question to them they provided some custom CSS to add but it did not work straight away as it was.
    So, I played about with the code a little bit and managed to make it work.
    Therefore I thought it would be good to share with you guys so anyone can see this if they have the same issue and want the text on slides to be hidden until hovered over.
    Here is my code:

    .wooslider .overlay-natural.layout-text-bottom .slide-excerpt {
    opacity: 0;
    visibility: hidden;
    max-width: 50%;

    .wooslider .overlay-natural.layout-text-bottom:hover .slide-excerpt {
    opacity: 1;
    visibility: visible;
    max-width: 50%;

    At present, only the ‘Posts’ slideshow option lets you have the content overlay. I set it to display along the bottom and to be ‘natural’.
    So depending on how you have it set up you will need to adjust accordingly.
    I also set a maximum width so the text would not run along the full width of the slide.
    This is a great bit of code that I am sure will come in handy for others, as it has for me.
    Be aware though, I am using the ‘Canvas’ theme, but it should be the same for whatever you use.

    Anyway I hope this helps anyone with the same issue!

    Thanks again,

    Simon Madeley
    Hammond Design

    Jamie Marsland

    Great stuff!!!

    Thanks sooo much for sharing Simon :)


Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.
Scroll to Top