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

Home Forums CSS How Was This Done?

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

    I am working on a website. There is this css effect I want to implement. I know this may be easy and, but I need a little codepen example.

    I want to achieve this effect [here.]( “”) Hover over the images.

    Thank u.


    Thank you @Melindrea. I am trying to add transition effect to it, but it’s not working. Have tried add it to the a, a .shown-when-hover, a:hover .shown-when-hover, but it’s not working. You have any idea?


    Forked Melindrea’s pen.

    Added transition, slightly changed the method. The div is always visible, but is transparent, but the span inside is hidden. On hover, the div is changing background, thus transition works and span is showed.

    EDIT: The transition didn’t work, because it needs two states in order to work, like white-transparent and black-semitransparent, like in your example. In Melindrea’s pen there is only one background set and div is hidden when not hovered, so transition couldn’t work.

    Have fun!

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