[Resolved] Scroll to Section within a page does not show the complete section

Home Forums Support Scroll to Section within a page does not show the complete section

Viewing 15 posts - 1 through 15 (of 26 total)
  • Author
    Posts
  • #964603
    Sita

    Hello,

    In testing the scroll to sections, I see that part of the section is not visible. https://www.gydesoft.com/

    To illustrate, when I click on menu item ‘learning center’ and select ‘section 4’, a part of the section is not visible.

    How do I fix the issue?

    Thank you,
    Sita

    #964627
    Leo
    Staff
    Customer Support

    Hi there,

    Are you using GP’s smooth scroll with the sticky navigation?
    https://docs.generatepress.com/article/smooth-scroll/

    Let me know 🙂

    #964670
    Sita

    Hi Leo,

    Not working yet…Not sure I understand what custom-class is!!
    In Customizer: Smooth Scroll is ON, so also is Cache Dynamic CSS ON

    Under advanced menu properties:
    Link Target ON //// Title Attribute ON /// CSS Classes ON
    Link Relationship (XFN) /// Description /// Icon ON
    ***********************
    In the Edit Menus, Is the following correct:

    Section4 sub item Custom Link
    URL
    #
    Navigation Label
    Section4
    Title Attribute (blank)
    Open link in a new tab (not checked)

    CSS Classes (optional)
    smooth-scroll
    Icon: Select

    Thank you!

    #964673
    Sita

    Hi Leo,

    I also have the following in the ‘Edit Section’:
    Custom ID
    Section4

    Custom Classes
    Section4

    Thanks,
    Sita

    #964674
    Sita

    And, sticky Navigation is ON

    #965156
    Leo
    Staff
    Customer Support

    Instead of using # for the URL in the menu item, try using the section ID.

    #965184
    Sita

    Hi Leo,

    The problem is NOT that it doesn’t jump to section.
    The problem IS that the top portion of the section (that we chose to jump to) is cut off.
    As you can see in https://www.gydesoft.com/ :::: when I click on Section4 under the ‘Learning Center’ tab,
    the top portion of Section4 is cut-off. This happens with Section3 too…..

    How do we get the top portion of sections not to be cut off when we jump to the sections?
    The way it appears, at least on my site, is that the ‘section’ feature doesn’t work right.

    Thanks for your help,
    Sita

    #965398
    Sita

    Hi Leo,

    Is there a way to decrease the amount of vertical scrolling that happens when we jump to a section?
    This may solve the issue…

    Thanks,
    Sita

    #965479
    Tom
    Lead Developer
    Lead Developer

    Can you make sure the smooth-scroll class is added to the right menu item?

    I’m not seeing it here: https://www.screencast.com/t/AZJ2CSmbby

    Our smooth scroll feature should fix this issue for you 🙂

    #965519
    Sita

    That works now, thank you Tom.
    Is it possible to jump to a section on a page from another page? For example, can we go from another page to Section4 on the home page?

    Thank you!

    #965539
    Leo
    Staff
    Customer Support

    Yes you can. You would need to use the full link for the menu URL instead of just the ID:
    https://SITEURL/#ID

    Our smooth scroll option only works on the same page though unfortunately.

    #965553
    Sita

    Hi Leo,

    I tried htpps://siteurl/#id and I see the problem – does not go to the top of the section.

    Thank you,
    Sita

    #966160
    Tom
    Lead Developer
    Lead Developer

    Unfortunately, our script only works if the link is initiated on the page where the ID exists.

    When you link to an ID from another page, the browser itself takes you there immediately before our code can execute.

    #966191
    Sita

    Got it, thank you for the explaining why it doesn’t work.

    #966435
    Tom
    Lead Developer
    Lead Developer

    No problem. There might be some jQuery solutions out there, but I believe it would need to hijack the default behavior of the browser to work.

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