You have to hide the products sub-menu. It should expand when someone clicks it.
I have included a sample example which would help you.
You need to add this type of JavaScript:
$(function() {
var menuVisible = false;
$('#menuBtn').click(function() {
if (menuVisible) {
$('#myMenu').css({'display':'none'});
menuVisible = false;
return;
}
$('#myMenu').css({'display':'block'});
menuVisible = true;
});
$('#myMenu').click(function() {
$(this).css({'display':'none'});
menuVisible = false;
});
});
For this HTML code:
<div id="menuBtn">click me</div>
<nav id="myMenu">
<ul>
<li>entry 1</li>
<li>entry 2</li>
<li>entry 3</li>
<li>entry 4</li>
</ul>
</nav>
Thanks @coredesigners.net
Hi @janco147, I hope your issue is resolved now.
You can also raise the query at CyberChimps forums: http://cyberchimps.com/forum/
thanks for the help guys, unfortunately I do not have it working just yet.
I included the script in the theme footer like this:
‘</footer><!– #footer –>
<?php responsive_mobile_footer_after(); ?>
<?php responsive_mobile_body_bottom(); ?>
<?php wp_footer(); ?>
<script>
$(function() {
var menuVisible = false;
$(‘#mobile-nav-button’).click(function() {
if (menuVisible) {
$(‘.main-nav’).css({‘display’:’none’});
menuVisible = false;
return;
}
$(‘.main-nav’).css({‘display’:’block’});
menuVisible = true;
});
$(‘.main-nav’).click(function() {
$(this).css({‘display’:’none’});
menuVisible = false;
});
});
</script>
</body>
</html>’
since the html is like this, I adjusted the script for ids and classes accordingly:
‘<button id=”mobile-nav-button”></button>
<div class=”main-nav”>
<ul id=”menu-main-menu-en” class=”menu”>
<li id=”menu-item-812″ class=”menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-793 current_page_item menu-item-812″>Home
</div>’
BUT: nothing happens… any ideas?
Hi,
I am really sorry for the late reply.
I think maybe these plugins can be helpful.
Admin Menu Editor : https://wordpress.org/plugins/admin-menu-editor/
Responsive Menu : https://wordpress.org/plugins/responsive-menu/
