- This topic has 15 replies, 3 voices, and was last updated 6 years, 8 months ago by mike.
-
AuthorPosts
-
August 7, 2017 at 1:12 pm #361238mike
hi,
i am currently building a site, b3u5e.hosts.cx
i have a hamburger menu both for desktop and mobile which i set by using a normal menu item with child items
on the mobile the sub-menu opens opposite of the hamburger.
any ideas?
perhaps a simpler method to making the hamburger global?
also – is there a way to control the header padding on menu only?
August 7, 2017 at 1:36 pm #361247LeoStaffCustomer SupportHi there,
Looks like the responsive features are not triggering for your site?
Can you try disable all non-GP plugins to see if we can find the issue?
Thanks!
August 7, 2017 at 1:51 pm #361254mikethe hamburger which is there is just an icon.
is there a way i can keep the original hamburger from the responsive menu for the desktop as well?
i have canceled the responsive menu using this code
@media (max-width: 769px) {
.menu-toggle,
.main-navigation.toggled .main-nav > ul {
display: none !important;
}
.main-navigation ul,
.main-navigation ul li:hover > ul,
.sf-menu li:hover > ul, .sf-menu li.sfHover > ul {
display: block;
}
.main-nav .sf-menu > li {
float: right;
clear: none;
}
.nav-aligned-center.nav-below-header .main-navigation .menu > li,
.nav-aligned-center.nav-below-header .main-navigation .sf-menu > li {
display: inline-block;
}
.main-navigation .main-nav ul ul {
display: none;
float: right;
position: absolute;
top: auto;
left: 0;
z-index: 99999;
width:200px;
text-align:left;
}
.main-navigation .main-nav ul ul ul {
right: 100%;
top: 0;
}
.mobile-bar-items {
display: none;
}
}August 7, 2017 at 2:56 pm #361289mikehelp? :\
August 7, 2017 at 4:48 pm #361314LeoStaffCustomer SupportSorry I’m not sure what you are trying to accomplish?
You can’t really have hover on mobile so don’t think your method would work.
Why did you want to hide GP’s mobile menu?
August 7, 2017 at 10:52 pm #361400mikelet’s start over
i would like the hamburger menu to show on desktop as well.
help please?
August 7, 2017 at 10:55 pm #361401mikei have found this solution – the problem is the menu is not on the same line as the logo and it is centered instead of being on the right. and the sub-menu opens on the left – i need it to open to the right
what now?
thanks!
https://generatepress.com/forums/topic/hamburger-menu-on-desktop-standard-page-design/
@media (max-width: 768px) {
.main-navigation .menu-toggle {
display: block;
}.main-navigation ul {
display: none;
}.main-navigation.toggled .main-nav > ul {
display: block;
}.main-navigation .main-nav ul ul {
position: relative;
top: 0;
left: 0;
width: 100%;
}.main-navigation .main-nav .sf-menu > li {
float: none;
clear: both;
display: block !important;
text-align: left !important;
}.main-navigation .sub-menu.toggled-on,
.main-navigation .children.toggled-on {
display: block !important;
opacity: 1 !important;
}.main-navigation .dropdown-menu-toggle:before {
content: “\f107” !important;
}.main-navigation .sfHover > a .dropdown-menu-toggle:before {
content: “\f106” !important;
}.main-navigation .menu-item-has-children .dropdown-menu-toggle {
float: right;
}.main-navigation .mobile-bar-items {
display: block;
}.main-navigation .menu li.search-item {
display: none !important;
}.main-navigation .sf-menu > li.menu-item-float-right {
float: none !important;
display: inline-block;
}[class*=”nav-float-“] .site-header .inside-header > * {
float: none;
clear: both;
}
}August 8, 2017 at 12:17 am #361426TomLead DeveloperLead DeveloperHi there,
Give this a shot:
button.menu-toggle { position: absolute; text-align: right; } .main-navigation li a { text-align: right; }
August 8, 2017 at 11:56 am #361760mikethanks a lot this worked.
BTW
how can i control the padding of the mobile nav-bar/header? i need the padding under 768px to be 10px
on the desktop 40px looks great but on mobile it’s too muchthanks alot
August 8, 2017 at 2:03 pm #361842LeoStaffCustomer SupportTry this:
@media (max-width: 768px) { .inside-header { padding: 10px; } }
August 8, 2017 at 2:31 pm #361859mikethank you it works
i would like to note that your technical service is awesome
keep up the great work!
respect
August 8, 2017 at 3:14 pm #361877mikeanother quick question
because i set the mobile menu for desktop i now need to make it open on hover.
is this possible?
thanks
August 8, 2017 at 11:25 pm #361978TomLead DeveloperLead DeveloperThat would require some custom javascript I’m afraid.
August 9, 2017 at 3:17 am #362061mikeu are unable to help me with this?
August 9, 2017 at 10:20 am #362258TomLead DeveloperLead DeveloperWriting custom javascript like that is a little outside of the scope of support on this forum. However, if I get a moment today I’ll try to come up with something.
-
AuthorPosts
- You must be logged in to reply to this topic.