Shopify themes, liquid, logos, and UX
Currently using Debut theme and I added code to make it a hover menu. In order to keep a menu category open you have to click it and then click it again to close it. I want it to automatically close when you move your mouse away to another category (which opens on hover). I don't want to click to close the menu, I want to hover over to a new menu and it closes on its own. I've attached my code and a picture of the current issue.
Solved! Go to the solution
This is an accepted solution.
Hello @ihernandez
I think you can find clicking part here
cache.subNavToggleBtns.forEach(function(element) {
element.addEventListener('click', toggleSubNav);
});
Sorry you are facing this issue, it would be my pleasure to help you.
Welcome to the Shopify community!😊
Thanks for your good question.
Please share your site URL,
I will check out the issue and provide you a solution here.
@KetanKumar Hi,
this is currently a draft mode of the menu bar, is there another way i can share this with you?
this might work: https://wk9qfvnwna1srj4g-34543632443.shopifypreview.com
yes please add this code
1. Go to Online Store->Theme->Edit code
2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
.site-nav__dropdown {top: 20px !important;}
@KetanKumar It's doing the same thing.
I already have a hover functionality but I'm looking to have it close when I move my mouse away after clicking it open.
Maybe you can help me void the clicking part so it only hovers and stays open on hover a little longer?
This is an accepted solution.
Hello @ihernandez
I think you can find clicking part here
cache.subNavToggleBtns.forEach(function(element) {
element.addEventListener('click', toggleSubNav);
});
thanks it works now!
Hello, my debut theme mobile menu doesnt open when you tap on it. Here is my store link, thank you www.lifepaintz.com
sorry for that issue can you please revert your last change theme.js file doesn't work your last code see attachment error
Hello, I do not have the option to revert the code. There is no drop down menu allowing me to click a older version of that code. Can I duplicate the theme and copy a new Theme.js file into the active theme?
hi i tried copying and pasting a fresh theme.js file from a new debut theme. that still did not fix the issue sadly.
can you please download fresh debut theme then check
Portrait of Stephen positioned next to an image of planet Earth, with the Stephen's World ...
By JasonH Mar 18, 2024Digital marketers and app developers have tracked activity in apps and websites for yea...
By Ollie Mar 13, 2024February was an exciting month with Shopify Editions, informative webinars, and more! F...
By JasonH Mar 7, 2024