Lay Theme Forum

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

    Scroll to anchor

    General Discussion
    anchors menu
    3
    10
    2296
    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.
    • ArneRobot
      ArneRobot last edited by

      Hello Armin, hello Forum.

      I have the following problem: I have created a way to jump to anchors from the Lay Theme menu on a customer's website. Now I need to fix that solution for sub pages (projects) as well. My workaround was to have a "zurück"-Button in the menu which leads back to the home page. But my customer wants that link to jump to the anchor again…

      So my questions are:

      1. is it possible to have my menu work on all pages? So no "zurück"-Button would be necessary?

      2. or is it possible to make the "zurück"-Button jump to that anchor again?

      Here is my code:

      <script>
      jQuery(document).ready( function() {
      jQuery('a').addClass('scroll-to-anch');
      });
      </script>

      <script>
      jQuery(document).ready(function(){
      jQuery('body').on('click', '.scroll-to-anch', function(event) {
      event.preventDefault();
      var id = jQuery(this).attr('href');
      jQuery('html, body').animate( { scrollTop: jQuery(id).offset().top }, 750 );
      });
      })
      </script>

      Thank you and regards!
      Arne

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

        Hi Arne!

        Without seeing the website it is difficult to help. Can you upload it on a test server?

        Are you aware of this:
        http://laytheme.com/documentation.html#custom-javascript

        Because your Lay Theme website is a "Single Page" JavaScript application you cannot just use jQuery(document).ready(…) to execute your js because the ready event only fires once when the website loads the first time.

        Let me know!

        Best!

        Marius

        www.mariusjopen.world

        ArneRobot 2 Replies Last reply Reply Quote 0
        • ArneRobot
          ArneRobot @mariusjopen last edited by

          @mariusjopen Hi Marius.

          Oh yeah, I forgot the link in my first post, here we go: http://theartofmanagement.org/wp2017/

          Yes, I know about the single page js-solution and I have read the documentation. Fiddling around with scripts didn't work out so far so I need help to get me on the way. Since my anchor menu basically works I have hopes to expand it to one of the solutions from my original post.

          Thanks and regards,
          Arne

          1 Reply Last reply Reply Quote 0
          • ArneRobot
            ArneRobot @mariusjopen last edited by

            @mariusjopen Did you have time to look at my problem yet? Any ideas? Thank you!

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

              Hi Arne,

              ok. I got what you mean.

              1. is it possible to have my menu work on all pages? So no "zurück"-Button would be necessary?

              I would try to use the default way to use anchorpoints within the projects. Have a look here: http://www.echoecho.com/htmllinks08.htm

              2. or is it possible to make the "zurück"-Button jump to that anchor again?

              This would be a tricky one. but possible.
              There is a thing called Javascipt History.
              https://wiki.selfhtml.org/wiki/JavaScript/History

              It saves informations of the page you were coming from.
              But I am not sure how easy that will be to implement.

              I hope that helps!

              Best!

              Marius

              www.mariusjopen.world

              ArneRobot 1 Reply Last reply Reply Quote 0
              • ArneRobot
                ArneRobot @mariusjopen last edited by

                @mariusjopen Hello Marius,

                I tried your first solution but this doesn't work. If I remove the JavaScript from the menu links every anchor link will open a new window/tab but won't scroll to the section of the page.

                I already considered the second option but I gues that would only bring me back to my main page and not scroll to the anchor.

                I would need a script that does the following:

                1. jump to the main page and load it
                2. when loaded scroll down to the respectable section

                Hmmm, that should be possible, don't you think?

                Regards, Arne

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

                  Hi Arne!

                  Did you try this solution?
                  http://laythemeforum.com:4567/topic/947/scroll-to-anchors-with-fullscreen-slider-addon-back-to-top-button-doesn-t-work/2

                  Best!

                  Marius

                  www.mariusjopen.world

                  ArneRobot 1 Reply Last reply Reply Quote 0
                  • ArneRobot
                    ArneRobot @mariusjopen last edited by

                    @mariusjopen Yes, I had a look at that. But that solution only works on one page but doesn't solve the problem of getting from a project page back to the main page (and scroll down)…

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

                      Hi Arne,

                      I think there is no clean solution for this. You will have to find a workaround.

                      I tried this and it worked:
                      I created a link like this in a html textbox in the gridder:

                      <a name="chapter4"></a> 
                      

                      0_1498082353669_Bildschirmfoto 2017-06-21 um 23.58.23.png

                      Then I added #chapter4to the end domain and it jumped down to the anchor.

                      You will probably need to build an extra navigation which has the ````#ancors````` in the end of the url.

                      Like in the example I sent you in the beginning.

                      I hope that was not too confusing :-)

                      Best!

                      Marius

                      www.mariusjopen.world

                      doorofperception 1 Reply Last reply Reply Quote 0
                      • doorofperception
                        doorofperception @mariusjopen last edited by

                        This post is deleted!
                        1 Reply Last reply Reply Quote 0
                        • First post
                          Last post

                        Try this to fix issues 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

                        Recent Topics

                        • C

                          centred Carousel fixed width and proportions

                        • L

                          position Project titles outside the images on the side

                        • slow navigation WP admin control panel

                        • P

                          News element date and title order

                        laytheme.com