Cool, thats a pritty cool solution. Thanks.
Works as expected.

• This reply was modified 2 years, 5 months ago by xeovision.

dios mio .. yes, cache issue.. great thx .. so we can close this ticket

Login added by private window

Yes, the code is still there.
I found the bug, as i wanted to place the breadcrumb below:

[av_section min_height_pc='25' min_height_px='40px' padding='small' av-small-custom_margin_sync='true' color='main_color' background='bg_color' custom_bg='#a5dbe5'  av_uid='av-6lto8p' sc_version='1.0']
[av_textblock ][av_breadcrumbs][/av_textblock]
[/av_section]

…it brakes the sub page.

I have fixed all issues now. Just one open topic, how can i add breadcrumb to the category pages on the archive pages?
All addings to function.php breakes the page

• This reply was modified 2 years, 5 months ago by xeovision.

Well, thats definitly perfect.
I think, some users would use this function for their pages as well .. many many thanks for this work.

I understand, so let me show the issue:
This is how the backend is set: https://ibb.co/Jp0kRHJ
This is the frontend: https://ibb.co/qd94H6y
It is just an balc overlay that appears when you move the mouse over. The css is the same as above. I can send you the login by email, if this is more helpful

Many thanks @guenni007 .. i like this slowing up, nice gimmick.
I would like to have this also on the static overlays on images, can you help me with this? I have tried but do not get this animation, i think i usaing always thw wrong Styles…

/** hover on img ***/
#top .av-overlay-hover-deactivate:hover .av-caption-image-overlay-bg {
    opacity: 0.6 !important;  background-color: #000000;   }
#top .av-overlay-hover-deactivate .av-caption-image-overlay-bg {
  opacity: 0 !important; }
.av-image-caption-overlay-center {opacity:0!important;}
.av-image-caption-overlay-center:hover  {opacity:1!important; font-size: 20px !important;  }

.btn-blue {background: #0097D7; font-size:50px; height:80px; width:80px; 
font-weight: 800 !important; margin: 20px auto !important; line-height: 75px; }

This have been some test for searching the fix … it seems that the transparecy is working on the image, not on the overlay therefore the image is not visible and the overlay becomes grey (from white background) and does not show the image below.

from the logic perspective, this should work and set only the overlay as transparent bit it shows only a white background.:

.image-overlay { background: rgba(0,0,0,0.6) !important; }

No one an idea?
I have found this slution but it only add the title as overlay, not the description.

`/* Portfolio overlay with title */

/* Disable default animation */
#top .grid-entry a:hover .image-overlay .image-overlay-inside {
animation: none;
}

/* Overlay */
/* Portfolio overlay with title – disable default animation */
#top .grid-entry a:hover .image-overlay .image-overlay-inside {
animation:none;
}

/* Portfolio overlay with title – overlay */
#top .grid-entry .image-overlay .image-overlay-inside:before {
content:”;
position:absolute;
background:#000000; /* blue */
height:100%;
width:100%;
border-radius:0;
top:0;
left:0;
margin:0;
}

/* Portfolio overlay with title – remove default title below */
.grid-content .avia-arrow,#top .grid-entry .grid-content {
display:none;
}

/* Portfolio overlay with title – display title on hover*/
.grid-entry a:hover:before {
content:attr(title);
position:absolute;
width:100%;
z-index:1000;
text-align:center;
opacity:1;
font-size:18px;
color:#fff!important;
transform:translateY(-50%);
animation:avia-fadein .75s 1 cubic-bezier(0.175,0.885,0.320,1.275)!important;
top:50%;
padding:0!important;
display:flex!important;
align-items:center;
justify-content:center;
}

.avia_transform a:hover .image-overlay {
opacity:1!important;
}

Fantastic, this works excellent.
Thank you

Exzellent, this works fine.
Thank you