Using Push Sidebar as One Page Menu

  • Resolved tarundeology

    (@tarundeology)


    7 years, 1 month ago

    Hello,

    Thank you for creating this awesome theme. I’ve been using Mise for several websites.

    For the latest one, I need to use the push sidebar as a one page menu and no primary menu. So the header should only show logo and push sidebar toggle. Currently the page will scroll to respective section when clicked but it didn’t close once clicked. Visitor will have to close the sidebar in order to see the respective section.

    How do I make the push sidebar close when custom menu in it were clicked?

    I tried using javascript below but its not working.

    <script>
	jQuery(document).ready(function($){
            $('.responsive-menu li a').on("click", function(){
            $('.responsive-menu').slideUp();
            });        
</script>

    Please help.

Viewing 3 replies - 1 through 3 (of 3 total)
  • Theme Author CrestaProject

    (@crestaproject)

    Hi @tarundeology
    try this JS code:

    
<script type="text/javascript">
	jQuery(document).ready(function($){
		$( 'body.page-template-template-onepage #tertiary.widget-area .menu li a' ).click(function() {
			$('body, #tertiary.widget-area, .push-background, .opacityBox, .hamburger').toggleClass('yesOpen');
		});
	});        
</script>

    PS: I did not test, but I think it works ??
    Best Regards,
    CrestaProject

    Thread Starter tarundeology

    (@tarundeology)

    I added your code to header.php before wp_head(); but still not close when clicked. :'(

    I tried replacing the code with code below, but still not close.

    <script type="text/javascript">
        	jQuery(document).ready(function($){
                    $('#tertiary.widget-area.nano.has-scrollbar.yesOpen .menu li a').on("click", function(){
                    $('body, #tertiary.widget-area, .push-background, .opacityBox, .hamburger').toggleClass('yesOpen');
                    });        
        </script>

    please…. please……

    Thread Starter tarundeology

    (@tarundeology)

    Hello,

    Since I cannot use the push sidebar, I used the main navigation toggle menu button for mobile and I added this js in footer.php and it finally works!

    <script>
	jQuery(document).ready(function($){
		$('.main-navigation li a').on("click", function(){
			$('.main-navigation').removeClass('toggled');
			$("button.menu-toggle").attr("aria-expanded","false");
			$('.main-navigation').removeClass('toggled');
			$('button.menu-toggle .fa.fa-lg').removeClass('fa-times');
			$('button.menu-toggle .fa.fa-lg').addClass('fa-bars');
		});
	});
</script>

    Just sharing if anyone want to achieve the same. Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Using Push Sidebar as One Page Menu’ is closed to new replies.