The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS [Solved] Triggering transitions on other elements

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #43199

    I have a DIV which has 2 images inside of it. Both the images are wrapped in a single a href tag. The first image is a solid image, it has a relative position. The second image is a transparent PNG that sits over the top of the solid image with absolute positioning. Both images have a lowered opacity.

    Basically I want to be able to transition both images to full opacity on hover, but as the transparent png covers the solid image completely using :hover only triggers the transition for the top image, because I’m technically not hovering over the solid image below.

    Is there any way this can be achieved?

    Thanks in advance


    a img {
    transition: opacity 1s;

    a:hover img {
    opacity: 1;

    Would that work?


    Ended up using :hover pseudo class of the parent a element


    This article might help you too, it covers a very similar example – Using Pseudo Hover Class

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.