GT3 Themes Forums

Hi there!
I would like to change the default hover affect to my own one. Can you please guide on how to do that? Should I use some 3rd party plugins for that purpose?
Thanks.
Btw, you have an awesome gallery plugin

Hello!
Can you please share a link to the page where we can see your custom hover effect?

Hello!
Got your link via PM.
Our GT3 gallery block has a class "hover-default".

1) Background:

.gt3-photo-gallery-pro--isotope_gallery .hover-default .img-wrapper::before {
background: #000;
opacity: 0;
z-index: 1;
content: "";
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
transition: all .3s linear;
}

The transparency is changed when you hover:

.gt3-photo-gallery-pro--isotope_gallery .hover-default .gt3pg-isotope-item .img-wrapper:hover::before {
opacity: .5;
}

2) And a "+" sign

.gt3-photo-gallery-pro--isotope_gallery .hover-default .img-wrapper::after {
background: url(https://gt3themes.com/wp-content/plugin ... 556b2f.svg) no-repeat 50%;
background-size: auto;
background-size: 14px;
z-index: 2;
opacity: 0;
content: "";
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
transition: all .3s linear;
}

You can also change the transparency from 0 to 1

.gt3-photo-gallery-pro--isotope_gallery .hover-default .gt3pg-isotope-item .img-wrapper:hover::after {
opacity: 1;
}

Got it, thank you very much.
Have a great day!