Page 1 of 1

Higher z-index on hover

Posted: Tue Nov 12, 2019 2:48 pm
by Ainu
Is it possible to partly stack 2 images and let the image below get on top while hovering over it?
I tried a transition [ hover > z-index > 1000 ] on the image below, but nothing happens when i hover over it.

When i change the transition to [ hover > width > 10 ], the image below does get smaller, so it works for other properties.

Re: Higher z-index on hover

Posted: Tue Nov 12, 2019 3:59 pm
by Pablo
It's difficult to say anything meaningful about this without seeing what you have done.
But why don't you use the built-in rollover image instead?

Re: Higher z-index on hover

Posted: Tue Nov 12, 2019 4:25 pm
by Ainu
Because i can't partly stack two images with that function. See this example for what i mean:
https://www.elegantthemes.com/blog/divi ... ion-design

2 images that overlap each other and the lower image should overlap the upper image when hovered over. Can't share anything, because i don't have anything that works.

BTW: i can confirm that changing z-index through a hover transition does work for text and layout grid (and images IN layout grids). But nothing happens when applied to just images or shapes. Am i missing something?

Re: Higher z-index on hover

Posted: Tue Nov 12, 2019 4:44 pm
by Pablo
To be able to help you, I need a demo project.

Related FAQ:
viewtopic.php?f=10&t=82134

Re: Higher z-index on hover

Posted: Tue Nov 12, 2019 7:43 pm
by Ainu
Never mind, fixed it with a custom.css stylesheet in root directory! Can be closed.

Re: Higher z-index on hover

Posted: Tue Nov 12, 2019 10:13 pm
by piotrh
Hello Ainu,
Could You share what you did more precisly? I'm kind of interested in this topic. :D
Bests
P