Click here to Skip to main content
15,918,967 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
How to auto hide left menu panel when click on any menu?

Below is the website URL-
http://whowinkedme.com/

What I have tried:

I tried below code but is not working as I want.

<script>
$(document).ready(function() {
$('#sidr ul li > a').click(function(){
$('#main-nav').addClass("left14");
$('.wrap').css("width","1200px");
$('#sidr').toggle();
});
$("#main-nav").click(function(){
$('#sidr').toggle();
});
});
</script>
Posted
Updated 30-Jun-16 3:29am
Comments
ZurdoDev 28-Jun-16 7:46am    
Debug it and see why it isn't working.
Prava-MFS 30-Jun-16 9:30am    
The same question asked by another member. I posted the below answer to that member too.

1 solution

I just checked your code present here : http://www.whowinkedme.com/wp-content/themes/winked-child/js/scripts.js[^]

I can see you have used the below code for closing the menu on body click :-
$(".sidr-open #main-nav").click();


So, you can do the following to achieve the one you want.

1. Add hideMenu(); onclick method for all your menu list like :-
<a href="#Home" onclick="hideMenu();">...</a>
<a href="#About" onclick="hideMenu();">...</a>
<a href="#Share" onclick="hideMenu();">...</a>
<a href="#Screenshots" onclick="hideMenu();">...</a>
<a href="#Download" onclick="hideMenu();">...</a>
<a href="#Video" onclick="hideMenu();">...</a>
<a href="#Contact" onclick="hideMenu();">...</a>


2. Then add the definition for hideMenu() function like :-
<script>
function hideMenu() {
    $(".sidr-open #main-nav").click();
}
</script



Done !! Now the menu bar will hide automatically on selecting any of the menu in the list.

Hope this will help you :) .
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900