Gridbox Store App Released

Mon. - Fri. 9 am - 5 pm Ask a Question
Remember me

Caption Hover Effect inversely

1 month 9 hours ago #1

  • Thorsten's Avatar
  • Thorsten
  • Posts: 23
Hello,

is it possible to display the caption hover effect in reverse? So that the text appears first and disappears when you mouse over it? I would like to realize it as on this page (at "AGV für Sie")
Link

Thank you for the feedback and best regards,
Thorsten

4 weeks 2 days ago #2

  • Vyacheslav's Avatar
  • Vyacheslav
  • Posts: 12148
Hello,
Thank you for contacting us

Send us a link to page

Regards,
Vyacheslav, Balbooa.com

4 weeks 2 days ago #3

  • Thorsten's Avatar
  • Thorsten
  • Posts: 23
Hello Vyacheslav,
many thanks for your response.

I had sent the link to the website where it can be done the way I want.

I cannot yet give the link to the website where it is to be implemented because I do not yet have the extension in use there. I first wanted to clarify whether this is even possible.

If it were possible in principle, I would prepare it so far and then send you the link. But first I would like to know whether it is generally possible to implement it this way.

Thanks and best regards,
Thorsten
Werbeagentur Schulz-Design

4 weeks 2 days ago #4

  • Vyacheslav's Avatar
  • Vyacheslav
  • Posts: 12148
This can be done by adding custom code.
The code will differ depending on the selected effect (we need a link or know which hover effect you will use to help you).

Best Regards,
Vyacheslav, Balbooa Support Team

4 weeks 2 days ago #5

  • Thorsten's Avatar
  • Thorsten
  • Posts: 23
Hello Vyacheslav,
many thanks for your response.

Here is the link
I'm using Caption Hover Effect 7

If possible, I would like the hover effect at start and that it disappears on mouseover. As with the AGV Harz (link in my first post).

Thank you very much and best regards,
Thorsten

4 weeks 2 days ago #6

  • Vyacheslav's Avatar
  • Vyacheslav
  • Posts: 12148
You need to add this CSS code at the custom CSS file of your template
.ba-gallery .ba-gallery-grid.css-style-7 .ba-caption:not(:hover) {
    opacity: 1;
}

.ba-gallery .ba-gallery-grid.css-style-7 .ba-caption:hover {
    opacity: 0;
}

.ba-gallery .ba-gallery-grid.css-style-7 .ba-caption:not(:hover) h3,
.ba-gallery .ba-gallery-grid.css-style-7 .ba-caption:not(:hover) p.image-category,
.ba-gallery .ba-gallery-grid.css-style-7 .ba-caption:not(:hover) p.short-description {
    opacity: 1;
    transform: none;
    -webkit-transform: none;
}

.ba-gallery .ba-gallery-grid.css-style-7 .ba-caption:hover h3,
.ba-gallery .ba-gallery-grid.css-style-7 .ba-caption:hover p.image-category,
.ba-gallery .ba-gallery-grid.css-style-7 .ba-caption:hover p.short-description {
    opacity: 0;
    transform: translateX(100%);
    transition: all .4s ease-in-out;
}

Best Regards,
Vyacheslav, Balbooa Support Team

4 weeks 2 days ago #7

  • Thorsten's Avatar
  • Thorsten
  • Posts: 23
Great!
Thank you very much :-)

Best Regards,
Thorsten

4 weeks 2 days ago #8

  • Vyacheslav's Avatar
  • Vyacheslav
  • Posts: 12148
You are welcome ;)
Let us know if you need more assistance!

Best Regards,
Vyacheslav, Balbooa Support Team
Powered by Kunena Forum