Lay Theme Forum

    • Register
    • Login
    • Search
    • Recent
    • Tags
    • Popular
    • Users
    • Search

    collapse mobile nav on click menu-item

    General Discussion
    3
    10
    394
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • D
      designklinik last edited by designklinik

      Hi together,

      first of all thx for the great theme!

      I can't get my head around one thing and i didn't find any post about this in the forum. Is it possible to collapse the mobile-navigation (not the fixed navbar with the burger and the sitetitle)?

      I have a onepager happening on the work category. The menu-links direct to id's further down the page. I realized that the nav is collapsing when transitioning between pages or projects but it is not collapsing when staying on the same page using anchors to scroll to.

      Thx for ur time!

      1 Reply Last reply Reply Quote 0
      • mariusjopen
        mariusjopen Global Moderator last edited by

        Dear @designklinik
        I do not 100% understand what you are looking for :-)
        Can you provide a quick sketch?

        Best!

        Marius

        www.mariusjopen.world

        1 Reply Last reply Reply Quote 0
        • D
          designklinik last edited by designklinik

          Hi Marius,

          thx for the quick reply.

          I want the menu-items (link 1-link 4) of the mobile-menu to collapse (slide to top) if the user clicks on any of the menu-items (link 1- link 4) . So the page is not visually blocked by the mobile-menu. The navbar with the burger and the sitetitle has to stay.

          I think this function exists already for clickevents which lead to other pages or projects. But since i have a onepager and the menu guides towards id's on the same page (in this case category work) the mobile-menu is not collapsing.

          Here a sketch. THX for ur help!

          0_1548693750905_navbar.jpg

          1 Reply Last reply Reply Quote 0
          • mariusjopen
            mariusjopen Global Moderator last edited by

            Dear @designklinik

            so you want the dropdown navigation working for a single-page-website?

            That is not really possible because you cannot link with # to an ID.

            You could code the menu yourself with jQuery.

            Best!

            Marius

            www.mariusjopen.world

            1 Reply Last reply Reply Quote 0
            • mariusjopen
              mariusjopen Global Moderator last edited by

              But we will write it down for future improvements.

              www.mariusjopen.world

              1 Reply Last reply Reply Quote 0
              • D
                designklinik last edited by

                Hey Marius,

                thx for taking the time to answer!

                The dropdown-navigation works fine already. I have no Problems linking with an # to an id. I use a wordpress-plugin called "scroll to id". The whole page works just fine. I just want to get rid of the dropdown-menu after clicking on an item so it does not block the content. So far i have to close the menu on the x (burger) by hand. If u want to have a look at it to actually understand the problem i can send u a link via msg.

                I think i need to do a newpageshown-event on the menu but my javascript skills are too bad. Started learning it now to get my head around it. But will take me some time i realized.

                I thought this problem might have a less complicated solution. Guess this was wrong. =)

                1 Reply Last reply Reply Quote 0
                • D
                  designklinik last edited by

                  I actually just made it work with the following code in case someone is interested.

                  Thx alot for ur time anyway!

                  0_1549035384683_Bildschirmfoto 2019-02-01 um 16.35.57.png

                  K 1 Reply Last reply Reply Quote 0
                  • mariusjopen
                    mariusjopen Global Moderator last edited by

                    Dear @designklinik
                    ah ok. Well! Perfect solution! Happy you got it working!

                    Best!

                    Marius

                    www.mariusjopen.world

                    1 Reply Last reply Reply Quote 0
                    • K
                      kpyda @designklinik last edited by

                      Hi,
                      Thank you for a great theme and all the work you put into this project!

                      I have a similar issue as @designklinik. I'm using the "scroll to id" plugin on my one-page website too. The code that @designklinik provided works well, it hides the menu after clicking menu-items directing to id on the same page but I'm having a problem with making the menu reappear without page reload. The menu hides but the icon stays in "close" mode. I suppose the hiding process should affect the icon and change it to the "burger" mode.
                      My javascript skills are super basic but maybe @designklinik you had a similar issue and could shear your solution?

                      Any help will be appreciated!
                      Thank you!
                      K

                      1 Reply Last reply Reply Quote 0
                      • mariusjopen
                        mariusjopen Global Moderator last edited by

                        Dear @designklinik
                        I can imagine that this might do:
                        https://api.jquery.com/toggleClass/

                        Best!

                        Marius

                        www.mariusjopen.world

                        1 Reply Last reply Reply Quote 0
                        • First post
                          Last post

                        Before you post

                        Use the Search Feature. Maybe there is already a solution to your issue.

                        1. Update Lay Theme and all Lay Theme Addons
                        2. Disable all Plugins
                        3. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code ", click "Save Changes"
                        4. Now see if your problem solved itself
                        5. Go here, see if your problem is listed here:
                        Troubleshooting

                        When you post:
                        1. Post a link to where the problem is
                        2. If the problem is difficult to explain, post screenshots / link to a video to explain it

                        Thanks!

                        Online Users

                        Y
                        A
                        K
                        M
                        P

                        Recent Topics

                        • K

                          Unable to update lay theme / to login wp admin

                        • S

                          Theme crashed - because of Polylang?

                        • A

                          New button feature not available

                        • A

                          carousel addon not working after update

                        laytheme.com