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

Home Forums CSS css only flyout menu

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

    Hi guys,

    I’m trying to create a CSS only menu which is working out great so far except for one little detail. On a hover of the li the child submenu flies out. When hovering over another li I dont want it to fly out or in again. Just fade. I’m not sure if it’s possible with CSS. I found wildcard selector but it didn’t work :s

    Anyone has a simple straight css solution?


    Sure it’s possible…you’d need to use transitions for opacity, visibility and position..but it could be done.

    Frankly, I’d use basic Jquery but, as I said, it’s possible.

    If you show us a Codepen demo of where you are we can offer suggestions.


    I haven’t got time to make a codepen yet but you can see the menu here:

    Will try to do that later on.


    Here is the menu in codepen:

    At last I have added a fullscreen logo animation when clicking on the image. This circle should center in the screen but I haven’t got that figured out yet. Please mess around with the code :)

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