Scroll to active tab

  • Resolved louthenw

    (@louthenw)


    7 years, 3 months ago

    When I link to the tab using your link format

    yoursite.com/contact/?target=phone-numbers

    when I get to the page, the tab is open, but the page does not scroll to the open tab.

    I tried placing an anchor inside the open tab – and using the following link format

    yoursite.com/contact/?target=phone-numbers#phone-numbers

    This does open the page at the correct spot, but I have a new problem. When the page loads – all of the tabbed content is shown until the tab functions initialize. This moves the page, and although the viewport lands at the proper location when the page loads, when the tabs initialize – the viewport is now showing a different section of the page.

    Do you have any functions in your plugin that allow me to link to a specific tab, and also scroll directly to the top of the open tab?

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author cubecolour

    (@numeeja)

    Please provide a link to the page on your site where I can see the issue.

    • This reply was modified 7 years, 3 months ago by cubecolour.
    Thread Starter louthenw

    (@louthenw)

    I have put this on our test site so you can see it.

    If I load https://www.acorn-test.com/tabby?target=second-tab – the second tab does initialize – but the site does not scroll to the tab – it stays at the top of the page.

    If I load https://www.acorn-test.com/tabby?target=second-tab#second-tab – you will see that at first it does scroll to the correct spot on the page, but after the tabs initialize – the page changes height – and the viewport is now below the tabs.

    Plugin Author cubecolour

    (@numeeja)

    It is expect behaviour for the scroll position to be unaffected when the link has the target url parameter added.

    Adding the fragment identifier as you have in your second link is correct way to define the position of the viewport when the page is loaded, and this link appears to work as I would expect it to – ie it opens with the page scrolled to the anchor named after the hash character, so I have been unable to see the issue you have described.

    For the page to be opened with tab group shown at the top of the viewport, and with a specific tab open, I would suggest that it would be preferable for the named anchor to be located immediately before the tab group rather than within the tab’s content.

    Thread Starter louthenw

    (@louthenw)

    Brilliant solution – thank you – just needed to look at it from a different perspective ??

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Scroll to active tab’ is closed to new replies.