- This topic is empty.
April 9, 2018 at 4:44 pm #269628
So there is the main menu which is “menubarre” when i go hover the “menubarre” it shows 6 new menu which are called “sousmenubarre” and what i would like to do is when i go hover one of the 6 “sousmenubarre” its shows another menu for example, at line 8 i tryed to create a new menu which is called “.histoire” . The problem is that when i try to edit the “.sousmenubarre” at line 5 in the CSS the new menu i just maded shows up too because it is in the “li”. So i tried to do .menubarre :hover :not(.histoire) .sousmenubarre but it didn’t work. So i was wondering if there was a way to do it without JS ( for a school project).April 10, 2018 at 6:19 am #269642JeroenRParticipant
Try something like this: https://codepen.io/jeroenreijs/pen/eMxLBb
display: block;to the
That’s why you don’t need the absolute positioning anymore on the
.sousmenubarreclass and the hover state remains.
I gave your second UL the class
.sousmenubarre2(your original classname
1won’t work.). This class has
display: none;. And I also placed this 2nd UL into the LI of the first UL.
When hovering the LI which the second UL is in, it gets
display: inline-block;. The same as what you did on the first UL.April 10, 2018 at 9:47 am #269659
Thank you a lot but i only have 1 more question about what you did. Why did you change the display of the .imagemenu to block and remove the position absolute, like i would like to know what it does?April 10, 2018 at 12:42 pm #269671JeroenRParticipant
That is because when you use absolute positioning, the element is on top of the listitem with class
So when hovering that listitem, the hover effect is gone when the
sousmenubarrebecomes visible. So then when the hover effect is gone, the
sousmenubarredisappears, so that the hovering of the
menubarreagain can be reached, and so on.
display: inline-block;in your initial
sousmenubarreclass will make that more clear to you (line 82 in your CSS). Then you will see what’s really going on.April 10, 2018 at 7:17 pm #269689
I am not sure i understand it all but still thank you a lot for fixing my problem.
- The forum ‘Design’ is closed to new topics and replies.