There is a bug with the slide out menu where it will show residual options if you click on a menu item with a dropdown. You can get rid of it if you scroll down, but is there any way to not have this happen or is this something that you need to wait for a fix?
I just noticed this one too, but you can’t get rid of it because there isn’t enough room in the menu to scroll.
Hi there,
Thanks for writing in! I tested the Navigation Layered element locally and couldn’t replicate the issue you’re having. I tried with different settings and still not seeing any issue. Can you please try the default version of Navigation Layered element and see if you still see the same issue?
In the mean time you can temporarily fix the issue via custom CSS. try adding the following code in the Theme Options > CSS:
.x-current-layer {
background: #fff !important;
}
.x-anchor-layered-back:not(.x-active) {
display: none;
}
Let us know how this goes!
That’s perfect. Thank you!
Also, it may be hard to replicate on a desktop unless you are using something like Chrome’s responsive view as mouse movements which will clear the residue, so will “touches”.
Hi again,
I tested the navigation layered element with default settings in mobile mode locally and also in Chrome’s responsive mode and couldn’t replicate the issue on my end even when I change the settings. You can try adding a new navigation layered element with default settings and see if you can replicate the issue?
Let us know how this goes!
Yup, it’s still happening. Can you take a look at the site again? You still have to view it in responsive view though.
I also added a slide menu to the desktop. That is the one that should be tested on.
Hi There,
Sorry but neither I can replicate the issue even on Chrome’s responsive view, please provide a step by step guide how we can see the issue.
Try clearing your browser’s cache.
Thanks,
Right now you can’t see the issue because you have to view it at a desktop resolution. This is because I left the previous CSS effective at 979px and below. This site is going to be going live today, and I will have to remove the menu before that. I will leave the video attached though.
Hi @w3developing,
May I know what device or OS you’re testing it with? I couldn’t reproduce it on my tests. And in your video, it seems the transitions just stopped which shouldn’t be possible since the transition is applied through CSS.
Example,
.x-anchor {
display: inline-flex;
flex-direction: column;
position: relative;
min-width: 1px;
border-radius: 0;
cursor: pointer;
transition-property: border-color, background-color, box-shadow, opacity, transform;
}
Unless it’s a device or browser glitch, and may I know your browser version?
Thanks!
Chrome on OSX, Gaxaly S8, and iPhone 8 Plus. All of them have the same issue. I just removed the CSS that was fixing this to check again that this was the case, and it is. The cache on each device has been cleared multiple times.
Desktop:
iPhone
S8
Hi @w3developing.
I tried it on 3 devices including on MacBook with the same Chrome version and I’m still not getting this issue. I did see it fades but it doesn’t stay like that due to CSS transition.
I’ll continue checking, this may be specific to your device.
Thanks!
That may be because I had to put the CSS back. I just created a subdomain for you to test on. It’s a complete site copy, and I removed the CSS, so you should be encountering this issue. As the domain isn’t yet being pointed there you will have to update your hosts file to test it. https://www.fastcomet.com/tutorials/getting-started/local-hosts-file
Hi @w3developing,
Even without that CSS, it still works the same on my end. Or maybe is there any special procedure to trigger this issue? That CSS only alter the background and visibility and but the transition isn’t going to affect, and the transition works well in my view.
I’ll continue checking, though, if you can provide further information then it may help to further replicate the issue on our end.
Thanks!
Would you mind recording how you testing it again?
Hey @w3developing,
I have replicated the issue following what you have done in your screencast (see secure note).
It looks like it’s related to this thread. The lag was caused by several navigation elements in the page. Would you mind trying removing navigation elements in the page and leave only one navigation for testing? This is so we could confirm if what I suspect is true.
Please also give us WordPress Admin so we could do some more tests.
Thanks.
To answer your question in the video, I had to create a separate site for showing you the issue which is handled by CSS.
.x-current-layer {
background: #fff !important;
}
.x-anchor-layered-back:not(.x-active) {
display: none;
}
I made the dev site to show you the issue without the CSS fixing it because it looks like there is an issue with the menu that might need to be fixed. This is also why I removed the desktop menu from the original site. It wasn’t supposed to be there, but was there for testing on this, hence the dev.site.com.
I removed menu items for you and included a wordpress account. It looks like the issue is persisting even after item removal. I’m also not sure that this is related to the issue that what in the other thread. I wasn’t able to test it as I am on a Mac.
Hi @w3developing,
That’s where I checked, in your Dev site but couldn’t reproduce it. But I’ll continue checking, I also forwarded this to Christian for further checking as he was able to reproduce it.
Thanks!
Hey @w3developing,
Thanks for the credentials. I have logged in and deactivate all third party plugins and the issue persists. I then switched to the parent theme and the issue’s gone (see secure note). There’s something in your child theme that is causing this issue. It’s probably coming from your custom CSS but please check other customizations as well.
Regretfully, we do not have support for customizations. If you can’t fix the custom code, you will need to consult with a third party developer for this.
If your goal is to design the off canvas menu, I’d strongly recommend that you do it in the builder and not using custom CSS unless you know the effects of your code.
Before reporting an issue, please test for a plugin conflict next time and switch to the parent theme.
Thank you for understanding.