- This topic has 5 replies, 3 voices, and was last updated 5 years, 4 months ago by
Ying.
-
AuthorPosts
-
December 21, 2020 at 12:04 pm #1589806
liorsade8
Hi Tom and guys,
need your help please,
i’m working on a site: http://testsite.s178.upress.link
and trying to make a sub menu TOGGLED ON >> display at all time (by Default) when people click on any of the ABOUT sub menu pages:
CONTACT US
JOBS
CLIENTS
AWARDS
TEAM
COMPANY PROFILEAlso, i need this toggled on menu to stay sticky while scrolling…
i have searched and try all of your forum posts about it – even when this sub menu is a secondary menu…
even this topic #1066964 and it didnt work for me
i dont mind it to be… as long as it’s doing the job.
i’ve added in private information login + pass so it will be even easier for u guys.
please help
thanksDecember 21, 2020 at 5:50 pm #1590000Ying
StaffCustomer SupportHi there,
Try this css:
body .main-navigation.sub-menu-left ul ul { left: auto; opacity: 1; visibility: visible; height: auto; overflow: visible; position: fixed; }Let me know 🙂
December 21, 2020 at 11:14 pm #1590156liorsade8
please take a look on the site… now it’s like double…
or should i remove the code i did before?
thanksDecember 22, 2020 at 10:27 am #1591019David
StaffCustomer SupportHi there,
i am only seeing the one sub menu – did you resolve this ?
December 22, 2020 at 10:52 am #1591045liorsade8
hi
if u check it now… i eliminate all the code and left only with u’r code u will see it’s like double because of the sticky menu…
please do tell how it can be fixed.when u check please check a page that is scrollable, like this:
http://testsite.s178.upress.link/company-profilethanks
THIS IS ALL THE CODE I PUT THERE FROM THE BEGINING…
.site-header {display:none}
@media (min-width: 769px) {
.inside-navigation {
padding-top: 20px;
}}/* width */
::-webkit-scrollbar {
width: 10px;
}/* Handle */
::-webkit-scrollbar-thumb {
background: #000000;
}/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background: #000000;
}.sticky-enabled .main-navigation.is_stuck {
box-shadow: 0 2px 2px -2px rgba(0,0,0,0);
}body {
font-family: ‘proxima-nova’, sans-serif;
}.menu-toggle {
font-family: ‘proxima-nova’, sans-serif;
}.mobile-menu {
font-family: ‘proxima-nova’, sans-serif;
}.main-navigation .mobile-bar-items a {
padding-right: 0px;
}.main-navigation ul ul {
box-shadow: 0 2px 2px rgb(0 0 0 / 0%) !important;
}.menu-item-has-children .dropdown-menu-toggle {
display: none;
}body .main-navigation ul.menu > li > ul {
width: 100%;
}.mobile-header-navigation .mobile-header-logo img {
padding: 12px 0px 10px 15px;
}.page-id-28 .main-navigation ul ul {
background-color: #ffffff00;
}.page-id-28 .elementor-526 .elementor-element.elementor-element-73dd6fea:not(.elementor-motion-effects-element-type-background) {
background-color: #ffffff00 !important;
}.page-id-28 .elementor-572 .elementor-element.elementor-element-131a829c:not(.elementor-motion-effects-element-type-background){
background-color: #ffffff00 !important;
}.page-id-28 .dialog-widget-content {
background-color: #ffffff00 !important;
}body .sf-menu > li {
position: static;
}body .main-navigation ul.menu > li > ul {
width: 100%;
}body .main-navigation ul.menu > li > ul > li {
width: auto;
}body .main-navigation ul.menu > li > ul > li ul {
left: 0;
top: 100%;
}.main-navigation li {
float: right;
}
@media (min-width: 1200px) and (max-width: 2500px) {
.inside-navigation {
margin-left: 100px;
margin-right: 100px;
}}
@media (min-width: 769px) and (max-width: 1199px) {
.inside-navigation {
margin-left: 50px;
margin-right: 50px;
}}.main-navigation .main-nav ul ul li a {
padding: 10px 0px 10px 30px;
}/*!
* Hamburgers
* @description Tasty CSS-animated hamburgers
* @author Jonathan Suh @jonsuh
* @site https://jonsuh.com/hamburgers
* @link https://github.com/jonsuh/hamburgers
*/
.hamburger {
padding: 15px 15px;
display: inline-block;
cursor: pointer;
transition-property: opacity, filter;
transition-duration: 0.15s;
transition-timing-function: linear;
font: inherit;
color: inherit;
text-transform: none;
background-color: transparent;
border: 0;
margin: 0;
overflow: visible; }
.hamburger:hover {
opacity: 0.7; }
.hamburger.is-active:hover {
opacity: 0.7; }
.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner::before,
.hamburger.is-active .hamburger-inner::after {
background-color: #000; }
@media( min-width: 769px ) {
.hamburger-box {
height: 10px!important;
}}.hamburger-box {
width: 40px;
height: 20px;
display: inline-block;
position: relative; }.hamburger-inner {
display: block;
top: 50%;
margin-top: -2px; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
width: 40px;
height: 2px;
background-color: #000;
border-radius: 4px;
position: absolute;
transition-property: transform;
transition-duration: 0.15s;
transition-timing-function: ease; }
.hamburger-inner::before, .hamburger-inner::after {
content: “”;
display: block; }
.hamburger-inner::before {
top: -10px; }
.hamburger-inner::after {
bottom: -10px; }/*
* Collapse
*/
.hamburger–collapse .hamburger-inner {
top: auto;
bottom: 0;
transition-duration: 0.13s;
transition-delay: 0.13s;
transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger–collapse .hamburger-inner::after {
top: -20px;
transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear; }
.hamburger–collapse .hamburger-inner::before {
transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }.hamburger–collapse.is-active .hamburger-inner {
transform: translate3d(0, -10px, 0) rotate(-45deg);
transition-delay: 0.22s;
transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
.hamburger–collapse.is-active .hamburger-inner::after {
top: 0;
opacity: 0;
transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear; }
.hamburger–collapse.is-active .hamburger-inner::before {
top: 0;
transform: rotate(-90deg);
transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1); }.menu-toggle .mobile-menu,
.menu-toggle:before {
display: none;
}body .hamburger{
transform: scale(.8);
padding: 0;
line-height: 0;
vertical-align: middle;
}body .hamburger.is-active .hamburger-inner::after,
body .hamburger-inner,
body .hamburger-inner::before,
body .hamburger-inner::after,
body .hamburger.is-active .hamburger-inner,
body .hamburger.is-active .hamburger-inner::before,
body .hamburger.is-active .hamburger-inner::after{
background-color: currentColor;
}December 22, 2020 at 1:53 pm #1591235Ying
StaffCustomer SupportTry the edited CSS here:
https://generatepress.com/forums/topic/sub-menu-toggled-on-at-all-time-by-default/#post-1590000Let me know 🙂
-
AuthorPosts
- You must be logged in to reply to this topic.