Offset Not Working In Mobile

  • Resolved satpalsr

    (@satpalsr)


    4 years, 11 months ago

    I have setup different offset values for mobile and desktop following your suggestion on another thread.

    In plugin setting “Offset: #ps2id-dummy-offset” is set up.
    Also, I added following additional code in my Astra theme “Additional CSS” section:

    #ps2id-dummy-offset{
  height: 50px;
}
@media only screen and (min-width: 768px){
  #ps2id-dummy-offset{
    height: 120px;
  }
}

    I tried changing the values but it didn’t worked for mobile version. The desktop version is working fine but on the first click, it goes a little bit below and then reaches the correct position.

    Page url: https://financevidhya.com/ppf-nps/

    Click on the Table of Content anchor links for verifying.

    Please suggest solutions for these two problems. Thanks.

    • This topic was modified 4 years, 11 months ago by satpalsr.

    The page I need help with: [log in to see the link]

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

    (@malihu)

    4 years, 11 months ago

    Hello,

    It seems there’s another script handling your TOC links. The script is this one:

    ...plugins/easy-table-of-contents/assets/js/front.min.js

    Try this:

    Go to “Page scroll to id” settings and a)enable “Prevent other scripts from handling plugin’s links” option and b)set the “Prevent other scripts from handling plugin’s links selector(s)” option field value to:

    a.ez-toc-link

    Save changes, test and let me know

    Thread Starter satpalsr

    (@satpalsr)

    4 years, 11 months ago

    I tried exactly what you told but nothing changed. So, I also tried few other things:

    1. To resolve the dekstop problem i.e.:

    The desktop version is working fine but on the first click, it goes a little bit below and then reaches the correct position.

    I turned off lazy loading for all my posts. It is absolutely fine now.

    2. For mobile screens: Offset does not work.
    No matter what px value I set for the following code, there are no changes.

    #ps2id-dummy-offset{
  height: 50px;
}

    3. I went into setting of “Easy Table of Content” plugin and turned off “smooth scroll”. I tested your solution again for mobile. No changes.

    4. I deactivated your plugin and removed the code from “additional css”. Then, I turned on “Easy Table of Content” smooth scroll from its setting. For desktop option in its setting, it worked. For mobile option, again no changes.

    Current Setting:
    a) “Easy Table of Content” smooth scroll is off.
    b) “page scroll to id” plugin is set to the setting you told and “Additional css” code is added.

    Note: I am using Astra free version and to create sticky header, I have used this code:

    /*Make Header Sticky - for Astra 3.0 and later*/
.site-header {
    position: fixed;
    width: 100%;
		height: 75px;
		border-bottom: 1px solid;
		border-bottom-color: #efefef;
}

/*Adjust Content Padding - adjust this based on your layout*/
.site-content {
    padding-top: 100px!important;;
}

/*Adjust Content Padding for Mobile - adjust this based on your layout*/
@media (max-width: 800px){
    .site-content {
        padding-top: 90px!important;;
    }
}

/*Adjust Content Padding for Mobile - adjust this based on your layout*/
@media (max-width: 650px) {
    .site-content {
        padding-top: 90px!important;;
    }
}

    Update: The “Page scroll to id” is working fine on mobile for anchor links set up using Elementor. The changes in px value of code, does reflect in mobile. The only problem now is that it does not work with “Easy Table of Content” plugin on mobile.

    • This reply was modified 4 years, 11 months ago by satpalsr.
    Thread Starter satpalsr

    (@satpalsr)

    4 years, 11 months ago

    I flushed my website cache and now everything works perfectly fine. Thanks for your solution.

    Plugin Author malihu

    (@malihu)

    4 years, 11 months ago

    You’re welcome 🙂

    I’m marking this as resolved but if you need more help, let me know.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Offset Not Working In Mobile’ is closed to new replies.