cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - ActiveLovehtmlicon-new-collectionicon-personicon-teamlog-outoctocatpop-outspinnerstartv headernumbered-list123split-screen
user profile image

Using :hover and the sibling selector (~), we can apply different styles to elements based on their position. Removing the visibility transition gets rid of the previous element's ghost for a cleaner slide-in with no slide-out. Layout and images are auto-generated with Pug. Refresh for something different,

A simplified pen if you have trouble understanding how it works.


  1. This is fantastic so satisfying to hover around nice work!

  2. Very clever 🙌

  3. This is super clever, awesome work!

  4. amazing :o

  5. I saw this type of pen somewhere, but anyway this gallery is unbelievably nice.

  6. Very nice idea @giana! And can be used in so many interesting ways.

  7. Wowww this is amazing work ... quite inspiring.

  8. So creative and inspiring!

  9. I feel a sudden paradigm shift comin' on

  10. I like it, never see this efect...ten plus.

Leave a Comment Markdown supported. Click @usernames to add to comment.

You must be logged in to comment.