[Resolved] Off Canvas Panel – Working with anchor links

Home Forums Support [Resolved] Off Canvas Panel – Working with anchor links

Home Forums Support Off Canvas Panel – Working with anchor links

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1558670
    FunkyCss

    Hallo, i am going to use Generatepress for a one page website and i would like to ask if there is any tip to make the off canvas panel like a sticky navigation for the sections inside the page.

    I have made off canvas sticky and i have set my links for the sections and is working smoothly.

    But what i need to do is the off canvas to stay opened so it works like a navigation that moment on pc, i need only to be closed when i click the x button actually.

    Any recomendations to start doing that ?

    #1559492
    Elvin
    Staff
    Customer Support

    Hi,

    I’m not sure I understand what you mean. Off-canvas menu stays open when you open it as long as you don’t close it or you go to another page.

    To clarify: you want the off-canvas menu to stay open when you browse through other pages?

    Unfortunately this isn’t possible without significant site customization and this kind of customization is out of our scope.

    But to give you clues as to what you may need, search for AJAX navigation.

    A wise man once said:
    "Have you cleared your cache?"

    #1559927
    FunkyCss

    Hi thanks for the feedback, i actually dont need the off canvas to stay open on other pages.

    I am creating a one page site where i need the off canvas as my menu with inside the anchor links not pages.

    Like the link i provide down

    Where i dont want an overlay on the opening of canvas, i want the off canvas to stay open as you click on the anchor links an navigate throu the page.

    is possible ?

    #1561238
    Tom
    Lead Developer
    Lead Developer

    This goes against how it’s built to work, but you could try adding some javascript like this:

    var slideoutLinks = document.querySelectorAll( '.slideout-navigation ul a' );
    
    for ( var i = 0; i < slideoutLinks.length; i++ ) {
    	slideoutLinks.removeEventListener( 'click', 'closeOffsideOnAction', false );
    };

    Let me know ๐Ÿ™‚

    #1561298
    FunkyCss

    Hallo Tom thank you so much for your nice code, i made a hook in entire page, at the end of the wp footer but it looks like is not working , when i click it it will close unfortunetaly , did i miss something ?

    on the console – > closeOffsideOnAction is not defined slideoutLinks.removeEventListener( 'click', <strong>closeOffsideOnAction</strong>, false );

    #1562098
    Tom
    Lead Developer
    Lead Developer

    Can you try the updated code above and increase the priority of the hook to something like 100?

    #1565422
    FunkyCss

    Hi TOM , this still will not work , but i find it more easy to create a custom header as the project needs more things on this one and i dont want to be a weight here on forum asking for this kind of support.

    Once again thank you so much for the guide, also Elvin for recomending Ajax Nav , that is a nice idea that i have already managed to create in onother project!

    #1566462
    Tom
    Lead Developer
    Lead Developer

    Sounds good! Thank you ๐Ÿ™‚

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.