Skip to content
  • Recent
  • Tags
  • Popular
  • Users
  • Search
Skins
  • Light
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse

Lay Theme Forum

  1. Home
  2. General Discussion
  3. Scroll to anchor

Scroll to anchor

Scheduled Pinned Locked Moved General Discussion
anchorsmenu
10 Posts 3 Posters 2.7k Views
  • 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.
  • ArneRobotA Offline
    ArneRobotA Offline
    ArneRobot
    wrote on last edited by
    #1

    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
    0
    • mariusjopenM Offline
      mariusjopenM Offline
      mariusjopen
      Global Moderator
      wrote on last edited by
      #2

      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

      ArneRobotA 2 Replies Last reply
      0
      • mariusjopenM mariusjopen

        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

        ArneRobotA Offline
        ArneRobotA Offline
        ArneRobot
        wrote on last edited by
        #3

        @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
        0
        • mariusjopenM mariusjopen

          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

          ArneRobotA Offline
          ArneRobotA Offline
          ArneRobot
          wrote on last edited by
          #4

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

          1 Reply Last reply
          0
          • mariusjopenM Offline
            mariusjopenM Offline
            mariusjopen
            Global Moderator
            wrote on last edited by
            #5

            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

            ArneRobotA 1 Reply Last reply
            0
            • mariusjopenM mariusjopen

              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

              ArneRobotA Offline
              ArneRobotA Offline
              ArneRobot
              wrote on last edited by
              #6

              @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
              0
              • mariusjopenM Offline
                mariusjopenM Offline
                mariusjopen
                Global Moderator
                wrote on last edited by
                #7

                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

                ArneRobotA 1 Reply Last reply
                0
                • mariusjopenM mariusjopen

                  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

                  ArneRobotA Offline
                  ArneRobotA Offline
                  ArneRobot
                  wrote on last edited by
                  #8

                  @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
                  0
                  • mariusjopenM Offline
                    mariusjopenM Offline
                    mariusjopen
                    Global Moderator
                    wrote on last edited by
                    #9

                    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

                    doorofperceptionD 1 Reply Last reply
                    0
                    • mariusjopenM mariusjopen

                      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

                      doorofperceptionD Offline
                      doorofperceptionD Offline
                      doorofperception
                      wrote on last edited by
                      #10
                      This post is deleted!
                      1 Reply Last reply
                      0
                      Reply
                      • Reply as topic
                      Log in to reply
                      • Oldest to Newest
                      • Newest to Oldest
                      • Most Votes


                      I also code custom websites or custom Lay features.
                      💿 Email me here: 💿
                      info@laytheme.com

                      Before you post:
                      1. When using a WordPress Cache plugin, disable it or clear your cache.
                      2. Update Lay Theme and all Lay Theme Addons
                      3. Disable all Plugins
                      4. Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"

                      This often solves issues you might run into

                      When you post:
                      1. Post a link to where the problem is
                      2. Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
                      3. If the problem is difficult to explain, post screenshots / link to a video to explain it
                      Online Users
                      Forgot your key, lost your files, need a previous Lay Theme or Addon version? Go to www.laykeymanager.com
                      laytheme.com
                      • Login

                      • Don't have an account? Register

                      • Login or register to search.
                      • First post
                        Last post
                      0
                      • Recent
                      • Tags
                      • Popular
                      • Users
                      • Search