argyleink / gui-challenges

Components from the YouTube show GUI Challenges: accessible, responsive, adaptive and cross browser components.

Home Page:https://youtube.com/playlist?list=PLNYkxOF6rcIAaV1wwI9540OC_3XoIzMjQ

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Game menu

vasilich6107 opened this issue · comments

We can also add something like

.menu-3d .button-set-3d > li:is(:hover, :focus-visible):not(:active) {
  --menu-3d-distance: 3vmax;
}

.menu-3d .button-set-3d > li button:not(:active) {
  transition-timing-function: var(--menu-3d-bounce-ease);
  transition-duration: 0.4s;
}

to reduce glitch when button popus up and automatically loses focus)
When we move the mouse relatively slowly.

Mostly relates to top most and bottom most buttons)

oh like this mitigates the hover effect that move the button in or out of the mouse's hover target zone? able to make a codepen or video that compares them for me?

Will try to