How to layout a multi-level mobile menu, where are the main links?

Question

css

The menu is opened through hover, with such an implementation on a mobile device, when tapping on the main item, the link is followed. How to make such a menu?

Answer 1

On mobile, such a menu is duplicated on a regular one.

Answer 2

on mobile, remove the hover and do it on click. Tobish the first click opens the menu. the second click is already with the menu open - goes to the link

Answer 3

1. https://knackforge.com/blog/karalmax/how-deal-hove...
2. stackoverflow.com/questions/2851663/how-do-i-simul...
Media-query list (as an addition) :

@media (pointer:coarse) {
    /* Primary Input is a coarse pointer device such as touchscreen or XBox Kinect etc */
}
 
@media (pointer:fine) {
    /* Primary Input is a fine pointer device such as a mouse or stylus */
}
 
@media (hover:none) {
    /* Primary Input doesn't respond to hover at all, even partially (ie: there is no pointing device) */
}
 
@media (hover:on-demand) {
    /* Primary Input responds to hover only via emulation, such as touch screen devices */
}
 
@media (hover:hover) {
    /* Primary Input responds to hover fully, such as a mouse or a Nintendo Wii controller */
}